likes
comments
collection
share

栗子前端技术周刊第21期 - Rolldown 正式开源、TypeScript 5.4、Storybook 8...

作者站长头像
站长
· 阅读数 3

🌰栗子前端技术周刊第 21 期 (2024.3.11 - 2024.3.17)：浏览前端一周最新消息，学习国内外优秀文章视频，让我们保持对前端的好奇心。

📰 技术资讯

  1. Rolldown 正式开源：基于 Rust 的 JavaScript 打包工具 Rolldown 正式开源。Rolldown 的重点是性能，将会尽力与 Rollup API 兼容，目标是在对用户影响最小的情况下，在 Vite 上切换到 Rolldown。Rolldown 目前正在积极开发中，处于早期阶段，还不能用于生产。

  2. TypeScript 5.4 发布：TypeScript 5.4 正式发布，新增了一些小功能，包括一个新的 NoInfer 实用类型。

function createStreetLight<C extends string>(colors: C[], defaultColor?: NoInfer<C>) {
    // ...
}

createStreetLight(["red", "yellow", "green"], "blue");
//                                            ~~~~~~
// error!
// Argument of type '"blue"' is not assignable to parameter of type '"red" | "yellow" | "green" | undefined'.

  1. Storybook 8 发布：这个广受欢迎的前端组件开发工具引入了内置可视化测试、对 React Server Components 的支持、快达 50% 的启动时间、对 Vite 5 的支持以及升级的 Vue 和 React 组件自动生成功能。

  2. Shiki 1.0：功能强大的语法高亮 - 这是一款基于 TextMate 语法和主题的语法高亮器，与 VS Code 使用的引擎相同。

import { codeToHtml } from 'shiki'

const code = 'const a = 1' // 你的代码
const html = await codeToHtml(code, {
  lang: 'javascript',
  theme: 'vitesse-dark'
})

console.log(html) // 高亮的 html 字符串

📒 技术文章

🔧 开发工具

  1. React Geiger：聆听 React 性能问题的一种方法，Geiger 提供了一种有趣的方法，通过在运行时间超过预期时发出咔嗒声（类似于 Geiger 计数器），让 React 性能变得可闻。官方提供了一个 DEMO 可供体验。
栗子前端技术周刊第21期 - Rolldown 正式开源、TypeScript 5.4、Storybook 8...
  1. cmdk：快速、可组合的“命令菜单”组件 - 主页上有一些风格各异的示例。
栗子前端技术周刊第21期 - Rolldown 正式开源、TypeScript 5.4、Storybook 8...
  1. Capo.js： 五分钟提升网络性能？- Capo.js 旨在帮你将 <head> 中的元素排列整齐，从而提高性能。
栗子前端技术周刊第21期 - Rolldown 正式开源、TypeScript 5.4、Storybook 8...

🚀🚀🚀 以上资讯文章选自常见周刊，如 JavaScript Weekly 等，周刊内容也会不断优化改进，希望你们能够喜欢。

💖 欢迎关注微信公众号：栗子前端 💖

转载自:https://juejin.cn/post/7347190677505343522
评论
请登录