奇舞周刊第519期：用 View Transition API 在 Web 做出 Native 般丝滑的动画

记得点击文章末尾的“ 阅读原文 ”查看哟~ 

下面先一起看下本期周刊 摘要 吧

奇舞推荐

■ ■ ■

用 View Transition API 在 Web 做出 Native 般丝滑的动画

介绍了 View Transition API 的使用和原理，通过该 API 可以在 Web 中实现类似 Native 般丝滑的动画效果。View Transition API 允许我们通过定义不同的 transition-name，将页面中的元素分成多个图层，实现共享元素动画和自定义过渡动画。通过 View Transition API，我们可以轻松实现页面切换时的交叉淡入淡出、位移等动画效果，提升用户体验。

fsx 简介：JavaScript 的现代文件系统 API

介绍了 JavaScript 运行时中文件系统 API 的不足，并提出了改进的方案。作者设计了 fsx 库，它提供了现代、高级的文件系统 API，包括读取、写入、删除文件等常见操作，并支持日志记录和自定义实现。fsx 库在不同的运行时环境中都可用，包括 Node.js、Deno 和内存中实现，提供了统一的使用方式。

WebAssembly 和 JavaScript该怎么选？

文章从代码体积、初始化时间、代码执行时间这三个方面对比了使用WebAssembly 和 JavaScript这两种语言的代码执行性能。

技术实践

■ ■ ■

基于 istanbul 的前端代码覆盖率统计实战

代码覆盖率对于项目的质量和可靠性至关重要。它是衡量测试覆盖程度的关键指标，可以帮助开发团队评估他们的测试范围和代码质量。文章从技术选型、统计流程设计，到实际落地的全链路流程进行了详细介绍。

vivo智能活动中台：悟空系统建设之路

介绍了 vivo 智能活动中台悟空系统的建设之路，通过拖拉拽、AI 能力加持等方式，打造了一个灵活高效的活动可视化编辑系统。重点介绍了悟空系统的前台设计，包括组件开发、界面组装、代码生成和静态页面发布方案等；同时探讨了悟空系统中台的设计，包括活动中台整体架构和灵活高效的中台设计。

SPA 如何达到 SSR 一样的秒开效果？

文章介绍了将页面在打包期间生成静态html的方法，以及相关的注意事项，从而大大缩短spa页面的白屏时间，优化了页面的性能。

拓展边界

■ ■ ■

WebCodecs 开启 Web 音视频新篇章

介绍了 WebCodecs 的定义、应用场景和优势，解决了 Web 平台音视频编解码能力不足的问题，提供了精细控制和高性能的音视频处理能力，推动了 Web 音视频应用的发展。

数字人前端渲染方案探索

文章详细探讨了数字人技术和AI语言大模型技术在个性化学习、智能教育工具和口语教师方面的应用。技术选型包括Live2D、GPT、TTS和语音识别。通过整合这些技术，文章提出了创造高度智能化的口语教师的构想，为口语学习带来创新和娱乐性。最终，口语精灵被描述为口语学习的创新，为用户提供有趣、互动的学习体验。

穿越时空：2023年前端技术盘点与2024年技术展望

本文总结了 2023 年前端技术的发展与进步，并展望了 2024 年的前端技术趋势。文章涵盖了语言与标准的完善、前端框架的发展、前端基础建设的推进、低代码引擎的开源社区、大模型应用的落地、鸿蒙应用的兴起等方面的。

- END -

关于奇舞团

奇舞团是 360 集团最大的大前端团队，代表集团参与 W3C 和 ECMA 会员（TC39）工作。奇舞团非常重视人才培养，有工程师、讲师、翻译官、业务接口人、团队 Leader 等多种发展方向供员工选择，并辅以提供相应的技术力、专业力、通用力、领导力等培训课程。奇舞团以开放和求贤的心态欢迎各种优秀人才关注和加入奇舞团。