当前栏目
前端食堂技术周刊第 64 期:Node.js19、Interop 2022、SvelteKit1.0、2022 Web 性能回顾
这是前端食堂的第 140 篇原创
美味值:?????
口味:冰糖雪梨
- 食堂技术周刊仓库地址:https://github.com/Geekhyt/weekly[1]
本期摘要
- Node.js 19 的新特性
- Interop 2022 年终更新
- SvelteKit 1.0
- 2022 Web 性能回顾
- 最流行的 Node.js 框架
- 最流行的 CSS-in-JS 库
大家好,我是童欧巴。欢迎来到本期的前端食堂技术周刊,我们先来看下上周的技术资讯。
技术资讯
1. Node.js 19 的新特性[2]
- --watch flag(实验性?)
- 自定义 ESM Resolution
- V8 版本更新至 10.7,引入处于 stage 3 阶段的 Intl.numberFormat API[3]
- 不再支持 DTrace/SystemTap/ETW
2. Interop 2022 年终更新[4]
- Cascade layers[5] 主要的浏览器(Chrome、Firefox、Edge、Safari)目前都已支持,Firefox 还剩一些测试工作
- The dialog element[6] 主要的浏览器目前都已支持
- Subgrid[7] Firefox 和 Safari 支持
- Viewport units[8] 主要的浏览器都已支持
- Color 4
- Interop 2023[9] 完成初步规划
3. SvelteKit 1.0[10]
Svelte 也有了自己的元框架,SvelteKit 发布 1.0,并提供了交互式教程[11]。
下面我们来看技术资料。
技术资料
1. 2022 Web 性能回顾[12]
衡量和优化网站速度的方式一直在变化:新的标准、新的工具、新的衡量指标。本文整理了 2022 年 Web 性能方面的变化:
- Priority Hints
- 从 Chrome 106 开始,不再发出 OSCP 请求[13]
- 新的性能指标 INP[14],可能后面会取代 FID
- Core Web Vitals 作为桌面端的搜索排名因素
- Chrome 中的 Back/Forward 缓存[15]
- HTTP/3 标准化
- 更好的识别阻塞渲染的请求
- Chrome DevTools Performance Insights 面板
- 103 Early Hints
- Chrome 108 重启了全页预渲染[16]
- Safari 支持 AVIF 图片格式、图片懒加载
- DebugBear 的免费网站速度测试[17]、Chrome 插件 Site Speed by DebugBear[18]
2. 最流行的 Node.js 框架[19]
经过多年的稳定统治,Node.js 仍然是最受欢迎的 JavaScript 运行时。但最近 Node.js 框架的格局发生了巨大的变化,诞生了许多元框架。本文针对当前的趋势,探讨了 2022 年最流行的 Node.js 框架。
- Next.js[20]
- Nest[21]
- Strapi[22]
- Remix[23]
- Nuxt[24]
- SvelteKit[25]
- Fastify[26]
- Redwood[27]
- Express[28]
- Adonis[29]
- Keystone[30]
3. 最流行的 CSS-in-JS 库[31]
好文推荐
下面来看一下好文推荐,本周推荐的好文是:
好了,以上就是本期的食堂周刊,观众老爷们如果觉得还不错,一键三连是对食堂老板最大的支持。
你的前端食堂,吃好每一顿饭,我们下期见。
周刊一锅端
如果大家还没看过瘾,给大家推荐一下食堂技术周刊的合作伙伴,赶快把他们也抱入碗中吧~
- 前端早早聊的 18 个成长宝藏库[32]:前端早早鸟,前端早早跑
- MDH 前端周刊[33]:大厂一线 P8,Umi、Dva 等库作者
- DEX 周刊[34]:关于产品、设计、前端、软件等内容的精华资讯邮件列表
周刊赞助
整理周刊要花费大量的精力和时间,不过你可以通过以下方式支持我:
- 将食堂分享给你的朋友;
- 订阅食堂的竹白付费专栏(食堂为你准备了专属的会员通讯,以及前端食堂数字花园知识库的访问权限)。
订阅地址:https://hungryturbo.zhubai.love/
参考资料
[1]
食堂技术周刊仓库地址:https://github.com/Geekhyt/weekly: https://github.com/Geekhyt/weekly
[2]
Node.js 19 的新特性: https://blog.bitsrc.io/node-js-19-is-out-here-are-the-new-updates-291beb89ba7f
[3]
Intl.numberFormat API: https://github.com/tc39/proposal-intl-numberformat-v3
[4]
Interop 2022 年终更新: https://web.dev/interop-2022-wrapup/
[5]
Cascade layers: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_layers
[6]
The dialog element: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/dialog
[7]
Subgrid: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Subgrid
[8]
Viewport units: https://web.dev/viewport-units/
[9]
Interop 2023: https://web.dev/submit-your-proposals-for-interop-2023/
[10]
SvelteKit 1.0: https://svelte.dev/blog/announcing-sveltekit-1.0
[11]
交互式教程: https://learn.svelte.dev/tutorial/welcome-to-svelte
[12]
2022 Web 性能回顾: https://www.debugbear.com/blog/2022-in-web-performance
[13]
从 Chrome 106 开始,不再发出 OSCP 请求: https://blog.webpagetest.org/posts/eliminating-ev-certificate-performance-overhead/
[14]
INP: https://www.debugbear.com/docs/metrics/interaction-to-next-paint
[15]
Back/Forward 缓存: https://www.debugbear.com/blog/back-forward-cache
[16]
Chrome 108 重启了全页预渲染: https://developer.chrome.com/blog/prerender-pages/
[17]
DebugBear 的免费网站速度测试: https://www.debugbear.com/test/website-speed
[18]
Chrome 插件 Site Speed by DebugBear: https://chrome.google.com/webstore/detail/site-speed-by-debugbear/peomeonecjebolgekpnddgpgdigmpblc
[19]
最流行的 Node.js 框架: https://stackdiary.com/node-js-frameworks/
[20]
Next.js: https://github.com/vercel/next.js
[21]
Nest: https://github.com/nestjs/nest
[22]
Strapi: https://github.com/strapi/strapi
[23]
Remix: https://github.com/remix-run/remix
[24]
Nuxt: https://github.com/nuxt/nuxt.js
[25]
SvelteKit: https://github.com/sveltejs/kit
[26]
Fastify: https://github.com/fastify/fastify
[27]
Redwood: https://github.com/redwoodjs/redwood
[28]
Express: https://github.com/expressjs/express
[29]
Adonis: https://github.com/adonisjs/core
[30]
Keystone: https://github.com/keystonejs/keystone
[31]
最流行的 CSS-in-JS 库: https://stackdiary.com/css-in-js-libraries/
[32]
前端早早聊的 18 个成长宝藏库: https://mp.weixin.qq.com/s/3yLbUwqzSy2gFHXkO0PICg
[33]
MDH 前端周刊: https://mp.weixin.qq.com/s/NGux3r0P1JJH_z4-vfeksQ
[34]
DEX 周刊: https://newsletter.dex.group/
公众号:前端食堂
知乎:童欧巴
掘金:童欧巴
这是一个终身学习的男人,他在坚持自己热爱的事情,欢迎你加入前端食堂,和这个男人一起开心的“变胖”~
相关文章
- V8 引擎:基于类型推测的性能优化原理
- Selenium IDE命令行运行器
- Go try 新提案靠谱吗?想简化错误处理了
- 如何快速检查元素是否存在?
- 彻底理解闭包实现原理
- Go 语言 Errgroup 库的使用方式和实现原理
- Rust中应该尝试使用的12个杀手级库,我们先来说几个!
- 聊聊Golang的Make和New函数
- 线上生产环境JVM内存泄露,我熬夜处理一通宵总结了一下经验
- 一文掌握契约测试
- 再有人说synchronized是重量级锁,就把这篇文章扔给他看
- 网络工程师的Golang之路-布尔值、比较运算符、逻辑运算符
- 构建基于Transformer的推荐系统
- Paxos分布式系统共识算法?我愿称其为点歌算法…
- 如何让调试线上 JS 报错像调试本地源码一样优雅?
- 使用 Lua 编写 Neovim,插件你会了吗?
- C语言如何实现面向对象
- 深入浅出数组reduce,看完就会
- 聊一聊苹果官网滚动文字特效实现
- 看完这个,我彻底理解了Golang的指针