{"id":23127932,"url":"https://github.com/zengming00/html-to-video","last_synced_at":"2025-06-22T23:05:17.641Z","repository":{"id":81168698,"uuid":"192495583","full_name":"zengming00/html-to-video","owner":"zengming00","description":"html网页动画转换成视频","archived":false,"fork":false,"pushed_at":"2020-07-07T06:10:10.000Z","size":22,"stargazers_count":6,"open_issues_count":1,"forks_count":1,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-04-04T05:43:31.787Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","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/zengming00.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-06-18T08:11:15.000Z","updated_at":"2024-08-26T04:24:10.000Z","dependencies_parsed_at":null,"dependency_job_id":"3a69c91e-be92-4f8d-9e8b-bff677a9d6e4","html_url":"https://github.com/zengming00/html-to-video","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/zengming00/html-to-video","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zengming00%2Fhtml-to-video","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zengming00%2Fhtml-to-video/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zengming00%2Fhtml-to-video/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zengming00%2Fhtml-to-video/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zengming00","download_url":"https://codeload.github.com/zengming00/html-to-video/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zengming00%2Fhtml-to-video/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261380896,"owners_count":23149963,"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-12-17T09:15:46.610Z","updated_at":"2025-06-22T23:05:12.618Z","avatar_url":"https://github.com/zengming00.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ca href=\"https://996.icu\"\u003e\u003cimg src=\"https://img.shields.io/badge/link-996.icu-red.svg\" alt=\"996.icu\" /\u003e\u003c/a\u003e\n\n2018年1月仍在职兔展时研究出来的一种h5转视频的技术，并未在兔展实际使用\n\n# 技术原理\n1. 截图，然后合成视频\n2. 直接录制\n\n需要由前端代码控制开始时间和结束时间\n\n# 两种方案，各有优缺点\n## 截图法\ntest.js与aa.html\n\n使用phantomjs，win和linux都可以用，但是效率不高，会导致丢帧，很难达到流畅的效果\n在动画较少时帧率会变高，动画较多时帧率会减少，导致合成视频后播放的速度发生变化，需要控制帧率，优点是可以在CLI下运行\n\n## 录屏法\nmain.js与win.html\n\n使用electron，但因为chromium浏览器的bug导致需要在linux下使用，windows下会录成黑屏，\n录屏的时候鼠标不要在上面，否则会把鼠标录下来，可以用其它方法避免这个问题比如在上面盖一个窗口，缺点可能是必需在GUI下运行\n\n优点是效率高，不会丢帧，可以录制高清视频，录制的是webm格式，另外还兼容node，可以直接使用esee现有的视频处理模块，可以说phantomjs有的功能，它都有\n\n```\nnpm install electron\nnpm start\n```\n\n# 通病\n都无法录制实时的声音, 需要后期合成\n\n# 安全问题\n两种方案都能与本地代码进行交互，存在一定风险，electron使用的是webview一定程度上风险会小很多\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzengming00%2Fhtml-to-video","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzengming00%2Fhtml-to-video","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzengming00%2Fhtml-to-video/lists"}