前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >新兴前端开发工具

新兴前端开发工具

作者头像
杜逸先
发布2023-07-09 11:07:52
2800
发布2023-07-09 11:07:52
举报

我在最近的前端项目中用到了 vite 与 swc 作为构建工具和 JavaScript 编译器,二者都比较年轻,但提供更优秀的前端开发体验。当下前端生态的新选手层出不穷,本文就简单介绍一下最近几年前端生态涌现的诸多新兴的技术与工具。

Javascript 运行时

Deno

Deno是一个使用 rust 开发,基于 V8 引擎的简单、现代、安全的 Javascript 和 TypeScript 运行时。

我在 2021 年的时候写过一篇文章介绍deno。最近两年 Deno 的发展比较迅速,引入了一些新的 API 与能力,提高了稳定性以及与 Node.js 的兼容性。

顺便提一下Deno Deploy平台,可以方便地部署 Deno 项目为 severless 应用。

Bun

Bun是一个使用 zig 语言开发的基于 JavaScriptCore 引擎的全功能 JavaScript 和 TypeScript 工具集。

JavaScript 编译器与打包器

SWC

SWC是一个可扩展的基于 Rust 的下一代快速 Web 开发工具,同时支持 JavaScript 的编译与打包。Deno 和 Next.js 都使用了 SWC 作为编译器。

esbuild

esbuild是一个极快的 web 打包工具,使用 go 语言编写。

bun bundler

bun 对 JavaScript 模块的打包有原生的支持(官方的 benchmark 中比 esbuild 要快很多)。

Node.js 版本管理工具

volta

volta是一个使用 Rust 开发的新兴的 Node.js 版本管理工具。我目前正在使用 volta 管理 Node.js 版本,可以简单地根据项目切换 Node.js(包括 npm 与 yarn)的版本,安装不同版本的 Node.js 也很快。

fnm

fnm是一个快速、简单的 Node.js 版本管理工具,使用 Rust 开发。

Node.js 包管理工具

yarn v2

yarn v2做了很多改进,比如使用 Plug’n’Play 模式进行依赖项解析,提高性能与可靠性;支持零安装模式;对 monorepo 的支持更好等。

pnpm

pnpm是一个快速、节省空间的包管理器。

构建工具

parcel

parcel是一个快速、零配置的 Web 应用程序打包工具,支持 JavaScript、TypeScript、CSS、HTML、JSON 等文件的打包。parcel 2.0 版本使用了 swc 作为编译器,速度快了很多。

vite

vite是一个新兴的前端构建工具,在开发时使用 HMR 技术实现秒级的热更新,编译时使用 esbuild 和 Rollup 进行编译与打包,速度非常快。vite 也是 vue3 的官方构建工具。

tuborpack

tuborpack是一个使用 rust 开发的针对 JavaScript 和 TypeScript 优化的渐进式打包工具,由 Webpack 的原作者开发。

前端框架(React.js 生态)

next.js

next.js是一个 React 框架,提供了 SSR、SSG、CSR 等多种渲染模式,同时提供了很多优秀的功能,比如图片优化、代码分割、预取、预加载、路由、静态资源优化等。

Remix

Remix是一个全栈 web 框架,支持 SSR 与 CSR。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2023-07-012,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Javascript 运行时
    • Deno
      • Bun
      • JavaScript 编译器与打包器
        • SWC
          • esbuild
            • bun bundler
            • Node.js 版本管理工具
              • volta
                • fnm
                • Node.js 包管理工具
                  • yarn v2
                    • pnpm
                    • 构建工具
                      • parcel
                        • vite
                          • tuborpack
                          • 前端框架(React.js 生态)
                            • next.js
                              • Remix
                              领券
                              问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档