首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏云云众生s

    Qwik带来简洁高效的Astro开发

    Paul Scanlon通过代码示例比较了React和Qwik,他认为Qwik值得作为React的替代品进行探索。 而且瞧,我发现了 QwikQwik 是什么? 官方的产品营销信息如下:"Qwik 是一个全新的 Web 框架,可以为任何规模或复杂程度的 Web 应用程序提供即时加载。" Qwik 团队比我讲述得好多了,所以可以访问文档来了解更多信息: 思考 QwikQwik Astro 集成 如我所言,我目前对 Qwik 的探索主要集中在我使用 Astro 的工作上。 总结 这些只是 React 和 Qwik 之间差异/相似性的几个示例,我个人真的越来越喜欢 Qwik 的思维方式。 没有人知道未来会怎样,但 Qwik 至少是为现在设计的,用于现在,我目前真的很享受这种体验。前进,Qwik 团队!

    77510编辑于 2024-03-28
  • 来自专栏Web Front End

    新时代的 SSR 框架破局者:qwik

    最后,笔者会针对于 qwik 提出自己的看法以及聊聊目前 qwik 存在的”问题“。 利用 qwik 的这个优势,在绝大多数应用中我们可以利用 qwik 保证你的 SSR 应用在保证快速的 FCP 的前提也同样拥有与之不相上下的 TTI 体验效果。 qwik 真的有那么快吗 说了那么多,那么 qwik 真的有那么快吗。 上图是利用 qwik 搭建的 builder.io 官方网站,我相信 builder.io 的数据已经告诉我们答案了。 当然,笔者对于 qwik 也仍是在学习阶段。后续会在公司里的更多项目尝试 qwik 之后也会和大家分享关于它的更多心得。 总而言之,qwik 的”无水合“设计思路目前看来的确会在框架层面带来巨大的性能提升。大家如果有机会的话也可以在项目中尝试一下 qwik ,相信会给你带来意想不到的收益效果。

    3.9K10编辑于 2023-01-09
  • 来自专栏云云众生s

    使用Astro、Qwik 和 Fuse.js构建网站搜索

    利用 Astro 的内容集合、静态端点和 Qwik 的 Astro 集成以及 Fuse.js,构建网站搜索功能的方法。 在这篇文章中,我将解释如何利用Astro的内容集合、静态端点以及Qwik与Fuse.js的Astro集成来构建站点搜索。 // src/content/posts/2024/02/the-qwik-astro-audiofeed-experiment.mdx --- base: posts title: 中 Qwik, --- 你可以在存储库中查看源代码:the-qwik-astro-audiofeed-experiment.mdx。 Qwik 我使用 Qwik 的 Astro 集成来帮助管理客户端状态。Qwik 比 React 更轻量,并且比纯 JavaScript 更简洁。 剩下的步骤将涵盖如何设置搜索和过滤。

    53210编辑于 2024-03-28
  • 来自专栏前端达人

    2024 前端技术盘点:React、Vue、Qwik 谁能领跑 2025?

    五、Qwik:2024 最值得关注的前端新秀 在竞争激烈的前端框架领域,Qwik 以其独特的性能优化理念成功吸引了开发者的目光。 作为一款相对年轻的框架,Qwik 并没有选择与主流框架正面对抗,而是通过创新的技术手段,为开发者提供了全新的解决方案,尤其是在性能优化和用户体验提升方面。 而 Qwik 的“可恢复应用”模式完全绕过了这个步骤,只在用户真正与组件交互时加载必要的 JavaScript。 为什么重要? 初始加载更快:无需一次性加载大量脚本,页面可在最短时间内呈现。 Qwik 的这种设计不仅提升了页面响应速度,还显著优化了用户体验。 从 React 的 Server Components,到 Vue 的信号式响应性,再到 Qwik 的可恢复应用,每个框架都在尝试突破技术的边界,为开发者带来更多可能性。

    3.8K20编辑于 2024-12-30
  • 来自专栏携程技术

    干货 | 新时代的 SSR 框架破局者:qwik

    最后,会针对于 qwik 提出自己的看法以及聊聊目前 qwik 存在的“问题”。 利用 qwik 的这个优势,在绝大多数应用中我们可以利用 qwik 保证你的 SSR 应用在保证快速的 FCP 的前提也同样拥有与之不相上下的 TTI 体验效果。 7)qwik 真的有那么快吗 说了那么多,那么 qwik 真的有那么快吗。 上图是利用 qwik 搭建的 builder.io 官方网站,我相信 builder.io 的数据已经告诉我们答案了。 当然,我们对于 qwik 也仍是在学习阶段。后续会在公司里的更多项目尝试 qwik 之后也会和大家分享关于它的更多心得。 总而言之,qwik 的“无水合”设计思路目前看来的确会在框架层面带来巨大的性能提升。大家如果有机会的话也可以在项目中尝试一下 qwik ,相信会给你带来意想不到的收益效果。

    3.4K50编辑于 2023-02-28
  • 来自专栏深度学习与python

    Qwik vs. Next.js:你的下一个Web项目应该选哪个框架?

    Qwik 是我进行 Web 项目开发的首选框架,而不是 Next.js。在本文中,我将探讨 Qwik 和 Next.js 的区别、优缺点。 为什么 Qwik 成为我的首选框架 最终,我选择了 Qwik 而不是 Next.js,原因有很多,其中包括开发经验、信号、可控程度、使用广大 React 生态系统的能力,以及 Qwik 框架的前瞻性特性 不过,相应地,Qwik 为这种水合提供了很大的灵活性。例如,你可以告诉 Qwik 等到浏览器 空闲 时才水合 React 组件。除了空闲之外,Qwik 还提供许多其他的控制机制。 这个情况与 Qwik 类似,但是可控程度更高。对于 Qwik 的方法,我真正喜欢它的地方是其对水合的控制。 总的来说,Qwik 提供了更好的开发体验——在大多数情况下,你都无需管理服务器和客户端组件——用 Qwik 进行开发更容易。这并不是说 Qwik 特意做了什么抽象。

    94510编辑于 2024-05-06
  • 来自专栏深度学习与python

    全新JavaScript框架Qwik:以独特可恢复性方式带来更快的网页应用

    Qwik 都能够体感快速地构建。 在 Qwik 文档中有详细的介绍: Qwik 只会预取当前页面需要的代码,避免下载与静态组件相关的代码。 最坏的情况是 Qwik 预取的代码量与现有框架的最佳情况相同,而在大多数情况下,Qwik 所预取的代码只会比现有框架要少。 Qwik 可以将应用程序分解成部分,这些分块可以按照用户交互的概率高低顺序进行下载。 Qwik 网站为开发者提供了教程、实例,以及一个供学习和尝试 Qwik 用的在线运行平台。 目前,Qwik 已推出测试版,且采用 MIT 许可开源,欢迎各位在遵循 Qwik 行为准则的前提下贡献代码。

    1.6K40编辑于 2022-11-28
  • 来自专栏前端F2E

    Qwik 与 Next.js:哪个更适合你的下一个网络项目?

    为什么 Qwik 成为了我的新宠框 在众多的前端开发框架中,我最终选择了 Qwik[1],而不是 Next.js[2]。 当然,在此过程中,我也使用过其他各种框架和库,但在我今年发现 Qwik 之前,React 一直是我事实上的前端库。 Qwik 是什么? Qwik 的情况类似,但是控制层面更大。我真正喜欢的是 Qwik 对水合的控制。Next.js 在这里几乎没有或很少有控制,而 Qwik 允许你在 加载、空闲、悬停等[15] 上控制水合。 本文译自:https://outshift.cisco.com/blog/qwik-vs-nextjs Reference [1] Qwik: https://qwik.dev/ [2] Next.js /#isbrowser-conditional [6] Think Qwik: https://qwik.dev/docs/concepts/think-qwik/ [7] Resumable: https

    71610编辑于 2024-05-18
  • 来自专栏魔术师卡颂

    如何移除你项目中99%的JS代码

    miško hevery 在演讲中,他介绍了一款全栈SSR框架 —— Qwik,这款框架号称「能帮你移除项目中99%的JS代码」。 他是如何办到的,本文我们来介绍下Qwik。 性能差? 那么Qwik的粒度是「组件中的某个方法」。 在Qwik中,后缀带$的函数都是「懒加载」的。 hydrate的粒度有多细,就取决于$定义的多细。 下面是列表滚到底的样子: 在Clock组件的useClientEffect$中定义「时钟指针摆动的逻辑」: Qwik中也存在类似React的useEffect,但在Qwik中这个Hook可以在服务端 所以在Qwik中,如无必要,数据不会被初始化两次。

    9.6K60编辑于 2022-11-22
  • 来自专栏前端框架

    学不完的框架,🐕舔不完的面,Qwik,你到底想嘎哈?

    最近我又又双学习了一个新框架,Qwik 真的没完没了了, 不过作为"前端娱乐圈战地记者",我继续帮大家踩雷。 初识qwik 废话不多说,我们先上代码。 p>     </>   ); }); sigal.gif useStore可以听提供方法,不过比较复杂: import {   $,   type QRL } from "@builder.io/qwik 抱歉,没有,因为Qwik是基于jsx的框架,所以只有拿useContext来将就了 type Store = {   count: number   add: QRL<(this: Store) =>  这得从qwik的架构说起,首先Qwik是个服务端渲染的框架,相当于Next.js(基于React服务端渲染框架)、 Nuxt.js(基于Vue地服务端渲染框架),换句话说,它天生支持服务端渲染的前端框架 mounted.gif 总结 qwik上线一年不到已经17.9k地star了,足见它地优秀了! 今天的分享就这些,如果大家喜欢我一定会再出一篇介绍其它几个有意思的Api的和编译相关的文章。

    1.3K20编辑于 2023-07-04
  • 来自专栏魔术师卡颂

    从 Islands Architecture 看前端有多卷

    这背后,就是更高的购买率,更多的钱~~~ 实现Islands Architecture的框架 在当前,实现孤岛架构的全栈框架主要是Astro与Qwik。 比如,在下面例子中.astro组件中引入了React、Vue、Svelte三款框架的组件: Qwik Qwik的作者是builder.io的CTO 「miško hevery」(同时也是Angular 而在Qwik中,孤岛架构最细的粒度是「组件中的某个方法」。 在Qwik中,后缀带$的函数都是「懒加载」的。 孤岛架构的粒度有多细,就取决于$定义的多细。 React 为什么文章开头暴躁老哥吐槽Astro、Qwik没有什么新鲜理念呢,这是因为React很早就在朝着孤岛架构的理念发展了。

    2.3K40编辑于 2022-11-22
  • 来自专栏MoonWebTeam

    LightHouse 跑分 100!这个框架究竟是怎么做到的(一)

    (https://qwik.builder.io/)。 有人就会问,加上预拉取之后,Qwik 的资源加载执行和现有的框架又有什么不同呢?其实还是有挺多不同的: 1)Qwik 能够从框架层面实现超细粒度力度的 chunk 和懒加载,这是其他框架不能实现的。 目前 Qwik 还处于 Beta 阶段,周边的生态不太完善,用在生产环境还不太现实。 对于不使用框架的页面,可以参考 Qwik 的思路来实现超细力度的懒加载。 期待 Qwik 正式版的发布。 8、参考材料 1)https://qwik.builder.io/ 2)WWC22 - Qwik + Partytown: How to remove 99% of JavaScript from main

    2.2K50编辑于 2023-02-28
  • 来自专栏前端Q

    2024 年让我想疯狂学习的几个框架。。

    Qwik - 非常快 Qwik演示 适合人群: 如果你想要一个高性能的 Web 应用 现有 React 开发者,希望尝试性能高、学习曲线低的框架 我们最后但同等重要的框架是Qwik[7]。 Qwik 是另一个使用 JSX 和函数式组件的框架,类似于 Solid.js,为基于 React 的开发者提供一个熟悉的环境,以便尽可能快的上手。 正如其名称,Qwik 的主要关注点是实现应用程序的最高性能和执行速度。 Qwik 通过使用可恢复性概念来实现其速度。 pvs=21 [7] Qwik: https://qwik.builder.io/

    74310编辑于 2024-04-15
  • 来自专栏魔术师卡颂

    Angular 之父为什么怼 React ?

    对话背景大概是: 传统SSR(服务端渲染)场景下使用的技术叫Hydration,「Miško」曾向「Dan」演示了一个新技术概念 —— Resumable 「Dan」认为这项技术不可行 「Miško」在Qwik 这就是Qwik框架中Resumable技术的设计理念 —— HTML优先,JS按需下载: 图来自于qwik文档 要实现Resumable,需要抛弃传统框架以CSR为基础(用JS生成HTML为主)的思路 实际上,如果以Chrome lighthouse的评分作为评判依据,其他框架确实都难以望Qwik的项背 这项技术之所以叫Resumable(恢复),是因为它与传统Hydration技术在首屏渲染时客户端逻辑的区别 而Qwik(实现Resumable技术的框架)使用Signal监听状态变化,这使得他能精确定位「状态变化所产生的影响」,即精确定位状态变化需要反序列化哪些数据。 在Qwik v1.0发布时,「Dan」第一时间送上祝福。 有意思的是,对于「Dan」的祝福,「Miško」回复道:我们都站在巨人(指React)的肩膀上。 这是不是说,我还是比巨人要高呢?

    45520编辑于 2023-08-30
  • 来自专栏沐洒

    Angular 之父为什么怼 React ?

    对话背景大概是: 传统SSR(服务端渲染)场景下使用的技术叫Hydration,「Miško」曾向「Dan」演示了一个新技术概念 —— Resumable 「Dan」认为这项技术不可行 「Miško」在Qwik 这就是Qwik框架中Resumable技术的设计理念 —— HTML优先,JS按需下载: 图来自于qwik文档 要实现Resumable,需要抛弃传统框架以CSR为基础(用JS生成HTML为主)的思路 实际上,如果以Chrome lighthouse的评分作为评判依据,其他框架确实都难以望Qwik的项背 这项技术之所以叫Resumable(恢复),是因为它与传统Hydration技术在首屏渲染时客户端逻辑的区别 而Qwik(实现Resumable技术的框架)使用Signal监听状态变化,这使得他能精确定位「状态变化所产生的影响」,即精确定位状态变化需要反序列化哪些数据。 在Qwik v1.0发布时,「Dan」第一时间送上祝福。 有意思的是,对于「Dan」的祝福,「Miško」回复道:我们都站在巨人(指React)的肩膀上。 这是不是说,我还是比巨人要高呢?

    66820编辑于 2023-07-05
  • 来自专栏HelloGitHub

    不可错过的效能利器「GitHub 热点速览 v.22.39」

    作者:HelloGitHub-小鱼干 如果你是一名前端工程师且维护着多个网站,不妨试试本周榜上有名的 HTML-first 的 Qwik,提升网站访问速度只用一招。 除了提升网站加载速度的 Qwik,本周周榜上榜的 Whisper 也是一个神器,可用来快速识别语音输入输出。 本周特推 1.1 HTML-first:qwik 主语言:TypeScript 想提高网站访问速度吗? Qwik 能提供最快的页面加载速度,无论你网站多复杂,将它变成不到 1kb 的 JS 进行加载从而提高它的访问速度。 GitHub 地址→https://github.com/BuilderIO/qwik 1.2 git 专属终端:gitui 主语言:Rust 为 git 定制的专属终端,gitui 采用 Rust

    1K20编辑于 2022-12-30
  • 来自专栏前端达人

    万字长文助你搞懂现代网页开发中常见的10种渲染模式

    就懒加载而言, Qwik 将通过极度懒加载来确保Web应用程序尽快加载,只加载必要的JavaScript捆绑包,并在需要时加载其余部分。 Qwik 可以在开箱即用的情况下完成所有这些操作,无需进行太多开发者配置。 这适用于复杂的博客应用和企业网站的发布。 优点 由于可恢复性而对网络中断具有弹性 快速加载时间 友好的搜索引擎优化 缺点 复杂的实施 更高的带宽使用 相关框架 Qwik Demo (Qwik) //components/Btn.tsx import /qwik-city"; import { Link } from "@builder.io/qwik-city"; export default component$(() => { return 参考文献 有关可恢复性的更多信息,请参阅文档:https://qwik.builder.io/docs/concepts/think-qwik/ https://qwik.builder.io/docs

    1K21编辑于 2023-10-25
  • 来自专栏夏天的前端笔记

    前端框架新势力大盘点

    Github:https://github.com/withastro/astro Qwik Qwik 最初于 2021 年 5 月发布,目前在 Github 上有 20.1k Star。 Qwik的特点包括: 延迟执行和下载JavaScript:通过尽可能延迟JavaScript代码的执行和下载,Qwik能够提供接近即时启动性能,这是当前一代Web框架无法匹敌的。 Qwik 解决了现代网站在启动时需要大量JavaScript代码的问题,这导致了网络带宽和启动时间上的瓶颈。 Qwik的设计目标是尽可能减少应用需要下载和执行的JavaScript代码量,从而实现更快的页面加载速度和更好的用户交互体验。 通过Qwik,开发者可以构建出具有出色性能和用户体验的Web应用,满足用户在不同设备和网络环境下的需求。

    1.1K00编辑于 2024-05-25
  • 来自专栏vue全家桶

    我感兴趣的技术四剑客

    从生成式 AI 到 Serverless,再到低代码开发,以及 Svelte、Solid 和 Qwik 这些令人兴奋的工具和框架,前端开发者们正迎来了一个全新的机遇和挑战。 面向未来的前端框架:Svelte、Solid 和 Qwik 的革新之道在快速变化的前端开发领域,除了目前三大框架(Vue、React、Angular)之外,Svelte、Solid 和 Qwik 这三个框架以其独特的特性和前瞻性的设计 Qwik:下一代模块化开发的探路者图片Qwik 是一个基于 ES Modules 的前端框架,以其模块化设计和高度可靠性的特性而引起了广泛关注。 它的最大亮点包括:灵活的模块化设计:Qwik 采用了基于 ES Modules 的开发和组织方式,充分利用模块化能力,使得应用的代码更加清晰、可维护性更高。 高可靠性的开发模式:Qwik 通过确保组件的重新渲染是可靠和可预测的,提供了出色的开发体验和性能保障。Svelte、Solid 和 Qwik 这些前端框架在创新和演进的道路上发挥了重要的作用。

    1.4K1112编辑于 2023-10-12
  • 为什么现代 JavaScript 开发者正在远离回调与框架?

    4.2 Qwik:可恢复的框架Qwik 提出了“可恢复(resumable)”的概念,最大化减少前端代码执行。页面首次加载几乎零 JS,让性能更上一层楼。 五、趋势背后的哲学:简洁、可维护、长期主义无论是从回调到 async/await,还是从大型框架到 HTMX/Qwik/Marko,其实都在指向同一个目标:简洁与可维护性。 选择轻量化方案 —— 不必为小项目上大框架,HTMX/Qwik/Marko 提供了替代路径。 优化本地开发环境 —— 不再依赖繁琐的配置,转而使用像 ServBay 这样的轻量级工具。

    32510编辑于 2025-09-03
领券