#7松桑前端后花园周刊-Firefox支持AV1、nextjs14.2、Biome1.7、AI工具集、CSS gap、CSS-in-JS

行业动态

Firefox 支持AV1视频编解码器

Firefox 现在支持用于加密媒体扩展(EME)的 AV1编解码器，视频可以支持更高播放质量。此版本 PDF 浏览器支持了文本高亮显示。

发布

1、Next.js 14.2 Released

Next.js 发布将近第八年，发布了14.2版本，支持使用 Turbopack 来改进本地开发、内存使用、 CSS 和缓存优化、改进错误消息等。

关于错误提醒，改进后会自动折叠错误栈信息，优先展示组件报错节点，再也不用担心看到满屏的错误栈信息摸不着头脑了。

2、Biome v1.7

Biome 是基于 Rust 构建的Web 项目的高性能工具链，旨在取代许多现有的 JavaScript 工具，集代码格式化、检测、打包、编译、测试等功能于一身，适用于 JavaScript、TypeScript、JSX、JSON 等。

V1.7 提供了从 ESLint 和 Prettier 迁移的简单路径：通过一条命令，读取对应配置文件并生成biome.json配置文件。

文章

Vue 相对于 React 我更喜欢的六个设计模式

作者比较了 React 和 Vue 在安装指引、响应式设计、单文件组件、条件渲染、计算属性和状态管理等六个方面的实现方式，更喜欢 Vue 的设计模式。

开源项目

丑头像生成器（Star 1k、Fork 126）

项目基于Vue3.0 和 svg 随机生成一个很丑的手绘头像。

网站

1、AI工具集

700+ AI工具集合官网，国内外AI工具集导航大全。

2、微博切九图

传入图片切割为九图、四图，满足社交平台个性分享功能。

CSS WEEKLY

1、CSS in React Server Components

作者借助 Nextjs 的 RSC 组件不能很好兼容 CSS-in-JS 库，阐述了 RSC（服务端组件）概念以及CSS-in-JS如何在服务端组件工作的。

2、Gap is the new Margin

作者根据谷歌统计数据：margin在谷歌浏览器页面使用的比例，得出CSS margin 属性使用率在下降，可以使用 gap（用于设置行与列之间的间隙） 来替代。

资源

1、Airbnb JavaScript 风格指南

Airbnb 团队内的JavaScript风格指南，给出代码规范和最佳实践，对编写整洁健壮的代码很有帮助。可以通过在Eslint 中集成 Airbnb提供的 ESLint 规则来约束代码规范：eslint-config-airbnb-base、eslint-config-airbnb。

2、2023年最火的300个JS会议/演讲清单（按播放量计）

作者根据 YouTube 的浏览次数，整理出了过去一年中与 JavaScript 相关的300个视频。清单中的会议包括：JSConf, JSWORLD, JSNation, React Summit, React Native EU, VueJS Amsterdam, TypeScript Congress等，相信能扩宽你的前端视野。

---

这里是松桑的前端后花园，目前坚持在写前端后花园周刊，专注前端基础领域，分享常见前端面试题、前端开源项目、工具库、前端最新动态，目前还一个前端菜鸟，和我一起打怪升级吧！这里是我精选的往期文章，希望对你有所帮助。

Node.js常用命令及学习资料

18个宝藏技术周刊，涵盖前端、产品、UX、AIGC、独立开发、科技（偷偷收藏）

为什么每个自媒体人都需要个人网站？（附十分钟快速建站教程）

我用 Nextjs 十分钟搭建了一个展示955公司网站

Gitbook 小书 - 快速创建你的个人专栏