{"id":21654696,"url":"https://github.com/localvoid/vdom","last_synced_at":"2025-04-11T21:14:03.862Z","repository":{"id":20273353,"uuid":"23546482","full_name":"localvoid/vdom","owner":"localvoid","description":"[UNMAINTAINED] Virtual DOM [Dart]","archived":false,"fork":false,"pushed_at":"2015-03-14T19:04:09.000Z","size":685,"stargazers_count":37,"open_issues_count":0,"forks_count":4,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-04-11T21:13:59.058Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-2-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/localvoid.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-09-01T15:10:13.000Z","updated_at":"2022-10-19T08:25:11.000Z","dependencies_parsed_at":"2022-07-25T07:17:04.937Z","dependency_job_id":null,"html_url":"https://github.com/localvoid/vdom","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/localvoid%2Fvdom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/localvoid%2Fvdom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/localvoid%2Fvdom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/localvoid%2Fvdom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/localvoid","download_url":"https://codeload.github.com/localvoid/vdom/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248480427,"owners_count":21110937,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-25T08:28:44.658Z","updated_at":"2025-04-11T21:14:03.834Z","avatar_url":"https://github.com/localvoid.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# VDom\n\nVirtual DOM library for [Dart](https://www.dartlang.org/) inspired by\n[ReactJS Reconciliation](http://facebook.github.io/react/docs/reconciliation.html).\n\nThis library is not intended for use by web-application developers, it\nis a low-level library for high-level libraries like\n[Liquid](http://github.com/localvoid/liquid/).\n\nVirtual DOM libraries can be designed in many ways depending on the\nproblems it is trying to solve, the primary use case for this library\nis performing updates to stateful trees.\n\nIn this library, Virtual DOM hierarchy does not represent one-to-one\nreal DOM hierarchy. Several Virtual DOM Nodes can refer to the same\nreal DOM node and have control over different properties.\n\nThere are no \"onEvent\" callback-style event listeners and they won't\nbe added in the future.\n\n## API\n\n### Context\n\nContext is an object that is used to pass specific details to the\nsubtree.\n\nDefault Context is a simple object with `isAttached` property.\n\n### Node\n\n#### `void create(Context context)`\n\nCreates a root-level html node for this virtual Node. It is essential\nto render Nodes in two steps, so we can propagate attached calls at\nthe same time as we render subtrees.\n\nTwo-step rendering is also solves problem when you need to stop at any\npoint in `render()` to wait for async operations. When we create\nroot-level html node, we can just place it as a placeholder in the DOM\nand wait for any async operation to finish.\n\n#### `void render(Context context)`\n\nRender attributes, styles, classes, children, etc. \"Second step\" in\ntwo-step rendering model.\n\n#### `void update(Node other, Context context)`\n\nApply changes to the DOM and transfer state from the previous virtual\ntree to the new one.\n\n## Usage example\n\n```dart\nimport 'dart:html';\nimport 'dart:async';\nimport 'package:vdom/vdom.dart';\n\nint count = 0;\nVElement root;\n\nvoid increment(){\n  count += 1;\n  rerender();\n}\n\nvoid rerender() {\n  var next = render();\n  root.update(next, const Context(true));\n  root = next;\n}\n\nVHtmlGenericElement render() =\u003e new VHtmlGenericElement('div')(count.toString());\n\nvoid main() {\n   root = render();\n   root.create(const Context(false));\n   root.init();\n   document.body.append(root.ref);\n   root.attached();\n   root.render(const Context(true));\n   new Timer.periodic(const Duration(seconds: 1), (t){ increment(); });\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flocalvoid%2Fvdom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flocalvoid%2Fvdom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flocalvoid%2Fvdom/lists"}