【第四十七期】2022-08-10

[Geekhyt]

美味值：🌟🌟🌟🌟🌟

口味：碳烤羊排

本期摘要

• Docusaurus 2.0
• 7 月登陆网络平台的新内容
• Nuxt.js 团队的轮子库
• React 的一些最佳安全实践
• 业务中的前端组件化体系
• DNS 查询原理详解

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

技术资讯

1.Docusaurus 2.0

你可能没用过 Docusaurus，但是你一定看过基于它搭建的网站，比如：Prettier、Babel、React-Native、Jest、Gulp、Redux、Tauri、Taro 等。

近期 Docusaurus 2.0 发布，核心功能如下：

• 支持用于客户端；
• 插件系统，核心功能由单独插件提供支持，也方便社区贡献插件；
• 更加灵活的主题定制，如：自定义 CSS 变量、提供用户自己的样式表、从头实现主题、覆盖内置组件；
• 文档版本基于快照，更加容易理解；
• MDX；
• 约定式文件系统。

2.7 月登陆网络平台的新内容

该系列博文会收集每个月登陆 stable(稳定) 和 beta(测试) 版本浏览器的有趣功能，如下是 stable 版本浏览器的部分：

Firfox 103 和 Safari 15.6 发布稳定版，在几个不错的 CSS 功能上获得了互操作性，如下：

• backdrop-filter，可以实现毛玻璃效果；

• scroll-snap-stop，更加良好的滚动体验。

下面我们来看技术资料。

技术资料

1.Nuxt.js 团队的轮子库

这个页面汇总了 Nuxt.js 团队创造的各种轮子。

2.React 的一些最佳安全实践

为了保证 React 应用的安全性，值得遵循的最佳实践。

包含如下方面：

• dangerouslySetInnerHTML；
• 避免直接操作 DOM 注入 HTML；
• 服务端渲染；
• JSON 注入；
• URL 注入；
• 避免有漏洞的 React 版本；
• 避免有漏洞的其他依赖；
• ESLint React 安全配置。

3.业务中的前端组件化体系

在一个业务体系中，组件化到底应该如何去做？

这篇博文试图围绕这个主题，给出一些可能的解决思路，包括如下方面：

• 组件的实现：状态与渲染、使用上下文管控依赖项、状态的可组合性、分层复用、多级子树、状态的依赖关系；

• 工程链路：组件依赖形态、跨技术栈集成、测试与分析。

4.DNS 查询原理详解

使用 dig 命令手把手带你跑通整个 DNS 查询过程。

5.README 的艺术

README 的正式命名日期可以追溯到至少 1970 年和 PDP-10，拥有高质量 README 的项目使用起来也非常舒适和安心，本文讨论了高质量的 README 应该包含哪些内容。

其他信息

• New in Chrome 104
• CSS transform 属性支持合并
• VS Code July 2022 (version 1.70)
• JavaScript Records & Tuples Proposal
• StackBlitz 支持收藏和社交预览
• @container and :has(): two powerful new responsive APIs landing in Chromium 105
• 区块链 Dapp 开发教程

好文推荐

下面来看一下好文推荐，本周推荐的好文是：

1.语雀 App 跨端技术架构实践

2.面向微前端，谈谈 JavaScript 隔离沙箱机制的古往今来

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

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