{"id":15314674,"url":"https://github.com/unframework/vdom-live","last_synced_at":"2025-09-13T01:48:28.992Z","repository":{"id":29683530,"uuid":"33226010","full_name":"unframework/vdom-live","owner":"unframework","description":"Re-render virtual DOM when interesting things (page events) happen, without observables","archived":false,"fork":false,"pushed_at":"2016-03-12T19:11:30.000Z","size":12,"stargazers_count":21,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-28T14:04:57.892Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/unframework.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-04-01T04:09:55.000Z","updated_at":"2020-05-02T14:47:43.000Z","dependencies_parsed_at":"2022-08-30T10:41:15.616Z","dependency_job_id":null,"html_url":"https://github.com/unframework/vdom-live","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fvdom-live","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fvdom-live/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fvdom-live/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fvdom-live/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/unframework","download_url":"https://codeload.github.com/unframework/vdom-live/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248703193,"owners_count":21148118,"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-10-01T08:46:37.249Z","updated_at":"2025-04-15T02:17:31.885Z","avatar_url":"https://github.com/unframework.png","language":"JavaScript","readme":"Virtual DOM Live\n----------------\n\nRender [virtual DOM](https://github.com/Matt-Esch/virtual-dom) as an element and then keep updating it as interesting things (page events) happen, without observables.\n\n- [NPM package](https://www.npmjs.com/package/vdom-live)\n- [Live demo on RequireBin!](http://requirebin.com/?gist=41d87350052e03ba6ebb)\n\nMotivation:\n\n* bye-bye application state change tracking, observables, digest loops, watches\n    * or something\n* great for\n    * quick prototyping\n    * not worrying about premature optimization\n    * writing awesome-sauce codes\n\nUses `requestAnimationFrame` to queue and debounce re-renders. Cleans up event listeners when root element is removed from the document tree.\n\nRelying on the [Angular Zone.js](https://github.com/angular/zone.js) library to detect incoming page and network events. Anything that runs inside the `vdomLive` wrapper will get incoming asynchronous events and timeouts picked up and triggering a redraw on the next animation frame.\n\n```js\nvar vdomLive = require('vdom-live');\n\nvdomLive(function (renderLive) {\n    var liveDOM = renderLive(function (h) {\n        return h('span', new Date().toString());\n    });\n\n    document.body.appendChild(liveDOM);\n});\n\n// ... and then let the user click something/receive AJAX/etc\n```\n\n### Todo\n\n* keep investigating other ways to detect interesting events\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funframework%2Fvdom-live","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Funframework%2Fvdom-live","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funframework%2Fvdom-live/lists"}