内核编程 内核态编程

大家好。很高兴再次见到你。我& # 34;高级前端高级& # 34;我会带大家关注前端前沿,深入前端底层技术。大家一起进步,欢迎大家关注,喜欢,收藏,转发!

内核编程 内核态编程

高级前端‬进阶‬高级前端高级

今天给大家带来的主题是盘点2022年最热的前端项目。以下是已发表相关文章的入口,可能对理解后续文章内容有所帮助。欢迎阅读:

《 JS Runtime vs. JS Engine!Deno/Bun/Node是运行时!》《 前有Deno、后有Bun、Node.js已穷途末路?》《 Node.js、Deno、Bun 6大典型场景性能大PK?》《前端 Deno 生态又添一员猛将 !SaaSKit 开源 !》《Builder.io 赢了!Qwik可恢复性与 SSR 的较量!》
《 孤岛架构让Marko、Astro、Qwik、fresh等5+框架火出天际!》《 Electron vs. Tauri?Tauri为何大火? 》《 NeutralinoJS 成为 Electron 和 Tauri 的下一个劲敌? 》《 前端热门框架 Next.js vs. Remix!谁更适合? 》《 盘点全网最火的6+ JaScript 运行时!Node/Deno/Bun 在列! 》《 Fresh大火!下一代 Web 全栈框架!》

话不多说,开始吧!

Bun

Bun是2022年新发布的JaScript运行时。与Node.js和Deno不同,它使用的是JaScriptCore引擎(苹果Safari浏览器的JaScript引擎),而不是V8引擎。这也是Bun号称比NodeJS和Deno更快的众多原因之一。

另外Bun是用Zig写的,Zig是优化Bun每一部分的低级编程语言(但是Zig太年轻,可能会成为社区推广的绊脚石),而Node.js和Deno分别基于C++和Rust。

Zig是一种系统级编程语言,以稳定性、可维护性和性能为设计目标,追求系统编程中的最佳位置,而不是C语言。

Bun于2022年7月初开始进入公测。即使在它的beta中,与Node.js相比,它也使得js的开发速度更快,但这不仅仅是因为它的执行速度。Bun也是一个npm客户端,它与几乎所有的NPM包都兼容(这是一个很好的起点)。您可能已经体验过等待npm安装完成有多烦人。解决方法也很简单,用Bun不会出现这种情况。根据测试,通常比npm i快2倍,比yarn快1.6倍。

上图对比Node.js,Bun,Deno等。从React服务器的渲染、服务吞吐量等多个维度。从图中可以明显看出,Bun相对于其他两者优势明显。

脚本执行效率:bun运行代替npm运行,每次执行节省160ms左右,比后者快30倍。

包安装:bun安装(使用系统调用)代替yarn安装,效率提高20倍。

下图是2022年Bun的恒星历史数据:

目前Bun在Github上有40.6k的star,1.1k+的fork,超过200+的开发者贡献代码,55k的项目依赖。

Fresh

Fresh是一个基于Deno的全栈Web框架,旨在通过消除构建步骤和减少发送给客户端的JaScript的大小来改善开发者的体验。Fresh 1.0于2022年6月底发布,备受关注。

Fresh由Deno的核心开发者之一Luca Casonato开发,主要是为了解决客户端渲染的高成本,从而大大降低用户体验,增加移动设备的功耗,影响程序的健壮性。

Fresh采用了完全不同的渲染模式,即大部分渲染在服务器端完成,客户端只负责重新渲染孤岛架构,从而提供交互性。

目前Fresh在Github上有10.2k的star,400+的fork,120+以上的开发者贡献代码。

Remix

Remix是基于TypeScript和React的全栈Web框架,于2021年底正式发布,此后受到广泛关注。其背后的团队迈克尔·杰克逊和瑞安·弗洛伦斯都是React的元老。

在官网上用“告别Spinnageddon”的广告语,真的让开发者很牛逼。

目前Remix在Github上有23.1k的star,1.9k+的fork,超过500+的开发者贡献代码,24.5k的项目依赖。

Markdoc

在线支付平台Stripe于2022年开放了文档框架Markdoc。Markdoc是一个基于Markdown的强大而灵活的内容创建系统,它允许用户创建自定义的文档站点。

Markdoc支持的Stripe文档站点就是最直接最免费的用例。允许开发人员制作复杂而漂亮的文档!

目前Remix在Github上有6.2k的star,120+的fork,900+的项目依赖。

Next.js

Next.js是一个React框架,允许开发者使用React框架构建超强、SEO友好、极其面向用户的静态网站和网络应用。Next.js以其最佳的开发人员体验而闻名,在构建生产就绪的应用程序时,它具有开发人员需要的所有功能。

Next.js具有混合静态和服务器渲染、TypeScript支持、智能打包、路由预取等功能。,无需额外配置。

目前,Next.js在Github上拥有104K star、23.4k+ fork和1314k+项目依赖,超过2.6k的代码贡献者。

SolidJS

Solid.js获得JS Nation 2022年度突破奖。这是一个简单、高效、优秀的JaScript库,用于构建用户界面。功能强大的可组合响应原语与JSX的灵活性相结合。使用合理和定制的API使开发变得有趣和简单。

非常高的性能优势(仅次于原生 JS)功能齐全,具有开发者对现代框架的所有期望没有隐藏规则和陷阱,简单、可组合的原语不断发展的生态系统

以下性能比较数据来自不同的框架:

目前Solid.js在Github上有27.1k的star,700+的fork,14k+的项目依赖,超过140+的代码贡献者。

Tailwind CSS

Tailwind CSS是一个CSS框架工具集。Tailwind有颜色、间距、比例和字体的默认值,可以开箱即用,但也可以定制。

目前,Tailwind CSS在Github上有67.1k的star,3.5k+的fork,4312k+的项目依赖,超过了165+的代码贡献者。

Tauri

Tauri是一个为所有桌面平台构建紧凑快速的二进制文件的框架。开发者可以集成任何编译成HTML、JS、CSS的前端框架来构建用户界面。

Tauri基于Rust构建,旨在确保安全性、高性能和前端框架兼容性,并允许您为所有桌面平台创建可执行的应用程序,包括macOS、Windows和Linux操作系统。

Tauri核心模块包括:Tauri、tauri-build、tauri-codegen、tauri-macros、tauri-runtime、tauri-runtime-wry、tauri-utils等。各模块的核心功能如下图所示,支持Linux、Windows、Mac等核心平台。

Tauri不是一个轻量级内核包装器。相反,它直接使用WRY和TAO来完成对操作系统进行系统调用的繁重工作。Tauri不是虚拟机或虚拟化环境。相反,它是一个应用程序工具包,允许您制作Webview OS应用程序。Tauri核心生态系统如下(具体模块功能请参考文末信息):

目前Tauri在Github上有62.2k的star,1.7 k+的fork,12k+的项目依赖,超过240+的代码贡献者。以下是Tauri的星史数据:

Turbopack

Vercel在next.jsconf 22上公布了Turbopack。它是一个针对JaScript和TypeScript优化的增量打包工具,号称比Webpack快700倍。

由于没有基于Rust的JaScript打包工具,Vercel在评估了可用的打包工具后,决定让Webpack的作者Tobias Koppers和Next.js的团队共同开发Turbopack,现在已经开源。

目前Turbopack在Github上有20.8k的star,1.4 k+的fork,20.7k+的项目依赖,超过320+的代码贡献者。

Vite

vite(& # 34;快速& # 34;,发音/vit/,发音用& # 34;veet & # 34)是一款全新的前端构建工具,可以显著提升前端开发体验。Vite是尤雨溪的前端开发和构建工具。Vite 3于2022年发布,主站使用新的VitePress默认主题。Vite主要由两部分组成:

一个开发服务器,它基于原生 ES 模块提供了丰富的内建功能,如速度快到惊人的模块热更新(HMR)。一套构建指令,它使用 Rollup 打包代码,并且是预配置的,可输出用于生产环境的高度优化过的静态资源。

Vite意在提供开箱即用的配置,而其插件API和JaScript API带来了高可扩展性和完整的类型支持。

目前Vite在Github上有55.1k的star,4.9 k+的fork,1184k+的项目依赖,超过了760+的代码贡献者。

本文总结

本文主要介绍2022年最火的前端项目以及各自的特点。由于篇幅有限,文章没有展开太多。如果有兴趣,可以在我的主页继续阅读,文末的参考资料提供了学习的优秀文档。最后,欢迎大家点赞、评论、转发、收藏!

参考资料

https://star-history . com/blog/star-history-yearly-pick-2022-frontend # fresh

https://github.com/markdoc/markdoc

https://github.com/vercel/next.js/

https://github.com/oven-sh/bun

https://github.com/solidjs/solid

https://github.com/vercel/turbo

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。

发表回复

登录后才能评论