Qwik：一款创新的JavaScript框架，致力于提升网页应用的速度与响应性

作者｜Bruno Couriol

译者 ｜ 马可薇

策划 ｜ 丁晓昀

近日，AngularJS 的创始人 Misko Hevery 宣布了 Qwik 框架测试版的发布，这一框架承诺即使在大型应用中也能实现几乎瞬间的响应速度。Qwik 的核心优势在于它能够在初始加载时仅下载少量代码，随后根据需要动态加载其余的应用逻辑和事件处理器。

在一场题为《如何从主线程卸载99%的Javascript》的演讲中，Hevery 解释了 Qwik 的工作原理：‘Qwik 的目标是确保即使是复杂的应用也能在 Google PageSpeed Insights 中获得满分，这主要通过最小化交互时间来实现。’

Hevery 强调，尽管业界在图像和 CSS 的优化上已经相当成熟，但在 Javascript 的优化方面仍存在不足，这是一个普遍存在的系统性问题，而非开发者的个人失误。因此，Qwik 致力于解决这一关键领域的问题。

Qwik 通过避免传统意义上的‘水化’过程来减少交互时间。传统的水化过程是指在服务器端渲染页面后，客户端需要重新解析并激活页面上的 Javascript 代码，这往往导致了延迟。而 Qwik 则是在服务器端运行应用，将应用的状态序列化并与 HTML 一同发送到客户端，从而绕过了水化步骤。这意味着客户端可以立即呈现可交互的内容，而不需要等待所有的 Javascript 代码都加载完毕。

此外，Qwik 采用了懒加载和预取策略，确保只有当用户实际与某个元素互动时，相关的 Javascript 代码才会被加载。这种方法不仅提高了性能，还减少了不必要的资源消耗。例如，一个按钮的点击事件处理程序可以在用户点击该按钮时即时加载，而不是一开始就加载整个应用的脚本。

Qwik 的文档详细说明了其如何优化代码的预取过程，指出 Qwik 会智能地预取当前页面所需代码，避免下载与静态组件无关的代码。在多数情况下，Qwik 预取的代码量会少于现有的框架。此外，Qwik 支持多线程下的代码预取和语法预分析，进一步提升了加载效率。

为了帮助开发者更好地理解和使用 Qwik，官方提供了丰富的教程、示例和一个在线代码运行平台。例如，一个简单的计数器应用可以通过 Qwik 的 component$ API 创建，其中状态管理通过 useStore API 实现，事件处理程序则通过在函数名后加 $ 符号来标记为可恢复的。

Qwik 的团队由多位知名开发者组成，包括 AngularJS 的创始人 Miško Hevery 和 Stencil 的创始人 Adam Bradley。目前，Qwik 已经开放测试版，并采用 MIT 许可证，鼓励社区参与贡献。