写点什么

前端食堂技术周刊第 57 期:Turbopack、Next.js13、Chrome107、Vite3.2、图解 TLS 1.3

作者:童欧巴
  • 2022-11-01
    北京
  • 本文字数:1538 字

    阅读完需:约 5 分钟

前端食堂技术周刊第 57 期:Turbopack、Next.js13、Chrome107、Vite3.2、图解 TLS 1.3

美味值:🌟🌟🌟🌟🌟


口味:荔枝红茶


本期摘要

  • Turbopack

  • Next.js 13

  • Chrome 107

  • Vite 3.2

  • Babel v7.20.0

  • 图解 TLS 1.3 连接

  • 全网最佳暗黑模式鉴赏

  • 组件画廊

  • 命令行的艺术

  • WebAPI 检查


大家好,我是童欧巴。欢迎来到本期的前端食堂技术周刊,我们先来看下上周的技术资讯。


技术资讯

1.Turbopack

Vercel 发布 Turbopack,目前处于 alpha 阶段。Turbopack 由 Webpack 作者 Tobias Koppers 亲自操刀,用 Rust 编写,作者的愿景是替代 Webpack 95% 的功能和扩展性。


其特性如下:


  • 吸取 Webpack 十年来的经验教训,结合 Turborepo 和 Google 的 Bazel 在增量计算方面的创新,创建了一个准备支持未来几十年计算的架构;

  • 官方声称热更新比 Vite 快 10 倍,比 Webpack 快 700 倍;

  • 内置增量计算引擎,可以达到单个函数级别的缓存;

  • 基于请求级别的按需编译;

  • 生态方面支持 JavaScript、TypeScript、CSS、CSS Modules、插件系统会计划支持 SCSS、LESS、Babel 等,流行的前端框架 Svelte、React、Vue.js 等。


尤雨溪近日也亲自对 Vite 和 Turbopack 的热更新性能进行对比,并公开 代码仓库,得出的结论是热更新性能差不多,远远没有上面声称的 10 倍差距。


营销归营销,一切还是等 Turbopack 的插件架构造出来再下定论吧,一个好的架构远远比用什么语言更重要,而且还要考虑到对已有生态系统的支持,前方的路还很长。


Turbopack 中 JavaScript 和 TypeScript 的打包是基于 SWC,随着 Turbopack 的发布,SWC 的作者 kdy1 宣布将他 新的 TypeScript 类型检查器开源,并且最终决定使用 Rust 编写。这个故事有点长,不清楚故事线的同学可以去链接里读。


这个新的 TypeScript 类型检查器叫 stc,要不要改个名字,叫 Turbocheck?🤣


坐等 Turbopack 官方公开下面数据的测试代码。


2.Next.js 13

Next.js 13 主要特性如下:


  • app/ Directory (beta):改进文件系统路由,包括对布局、服务器组件、流数据和数据获取的支持;

  • 新的 next/image 组件;

  • 全新的字体系统 next/font;

  • OG 社交卡片图像生成;


附赠 迁移指南Next.js Conf 回放

3.Chrome 107

Chrome 107 主要特性如下:


  • 添加 Screen Capture API 属性,改善屏幕共享体验;

  • Performance API 增加 renderBlockingStatus 属性,可以精确识别页面上的资源是否有渲染阻塞;

  • 声明式 PendingBeacon API 向后端服务器发送数据。

4.Vite 3.2

Vite 3.2 发布,主要特性如下:



坐等 Vite 4,Vite 4 RoadMap

5.Babel v7.20.0

  • 支持 TypeScript 4.9;

  • 支持 Stage 2 阶段的 Import ReflectionExplicit Resource Management

  • 支持编译给 Deno 使用;

  • 发布 Babel-loader 9.0,放弃对 webpack < 5 、Babel < 7.12 、Node.js < 14.15 LTS 的支持。


下面我们来看技术资料。

技术资料

1.图解 TLS 1.3 连接

如题。


2.全网最佳暗黑模式鉴赏

这个站点收集了全网支持 Dark Mode 的漂亮网站。


3.组件画廊

组件画廊收集了很多设计系统,并提供了搜索功能,当你输入一个组件名称,它会帮你找到拥有这个组件的组件库和设计系统。

4.命令行的艺术

无论你是新手还是老手,这个仓库都能帮助你提升使用命令行的效率。

5.WebAPI 检查

这个项目可以帮助你检查你的设备上有哪些 WebAPI 可用,在你想检查的设备上打开这个页面即可,项目目前正在施工中。

其他信息

好文推荐

下面来看一下好文推荐,本周推荐的好文是:


1.在 Next.js 中构建一个交互式的 WebGL 体验


2.8K HDR!|为 Chromium 实现 HEVC 硬解 - 原理/实测指南


好了,以上就是本期的食堂周刊,观众老爷们如果觉得还不错,一键三连是对食堂老板最大的支持。


你的前端食堂,吃好每一顿饭,我们下期见。


发布于: 刚刚阅读数: 4
用户头像

童欧巴

关注

你远道而来这世间,想必也是因为热爱吧。 2019-06-10 加入

公众号“前端食堂”CEO

评论

发布
暂无评论
前端食堂技术周刊第 57 期:Turbopack、Next.js13、Chrome107、Vite3.2、图解 TLS 1.3_chrome_童欧巴_InfoQ写作社区