今年的十月,不知道大家在 TODO List 上新增了多少条目准备尝鲜,你可能已经准备了 Vue3、Webpack5 以及 React v17.0 RC,然而十月中可却远不止这些东西值得一试,npm CLI 提示你可以通过
npm install -g npm@7
体验新版本,Chromium Blog 的推文也显示 Chrome 正在部署 HTTP/3 和 IETF QUIC……
登高远眺—
天高地迥,觉宇宙之无穷
基础技术
NPM v7.0.0 发布
npm v7.0.0 带来了比较多的新特性,Workspaces
、peerDependencies
自动被安装、支持yarn.lock
等,将与NodeJS v15
一起发布。如果你想立即尝试,可以使用npm i -g npm@7
在终端运行安装。

Chrome 正在启用 HTTP/3,支持 IETF QUIC
QUIC(Quick UDP Internet Connections)是谷歌制定的一种基于UDP的低延时的互联网传输层协议,结合了TCP、TLS等协议的特性。HTTP/3 是HTTP的最新版本,仅在QUIC上运行。
译文:https://www.oschina.net/news/119045/chrome-is-deploying-http3-and-ietf-quic

工程化
Webpack 5 Module Federation: JavaScript 架构的变革者
Module Federation
是 Webpack 5 的新特性之一,它可以使 JavaScript 应用在客户端或服务器上动态运行另一个 bundle 或者 build 的代码。在了解学习这个特性的过程中,本文是最好的教程,因为它是由Module Federation
的作者之一的Zack Jackson发布的,他在文中写到"Module Federation
之于JavaScript Bundler
,如同Apollo
之于GraphQL
",并阐述了相关的技术实现以及项目实践。
译文: https://zhuanlan.zhihu.com/p/120462530

图形编程
iOS UIScrollView 动画的力学原理
了解动画效果的力学原理对于设计的还原度非常重要,本文深度剖析 iOS UI 滚动视图动画的力学原理。
译文:http://www.martinrgb.com/blog/index.html#/HOW_UIScrollView_Works

设计哲学
被忽视的设计:中文字体
字体是设计的基本要素之一,然而关于 Type Design 的视频少之又少,非专业人士对其认知也非常有限,很多人都会觉得:“啊,原来空气也是要设计的吗?”,字体作为设计的基本要素之一,它关乎着一个民族的设计风格,这个视频用短短的六分钟简单动画和旁白将中文字体的基础知识给说明白了~

工具推介
svga——AE动画的另一个实现/展示方法
相比起有名的bodymovin lottie,svga使用了另一种方法记录动画信息:每一帧的信息在导出前计算好,记录在导出好的文件中,播放器在渲染时只需逐帧渲染,不需关心关键帧间插值的计算。由此带来的是解析、播放器的库比lottie的精简许多(gzip前57KB),导出的文件也较小;另外限制也更多:不支持复杂的矢量形状图层、不支持AE自带的渐变、生成、描边、擦除等、对设计工具原生动画不友好,对图片动画友好

沧海拾遗—
沧海拾遗,积跬步以至千里
设计稿 101% 还原之 Web 字体处理
字体设计是设计中的基本要素,同样也是在还原设计稿的过程中,提升用户体验的重要一环,在兼顾体验的同时 101% 的来还原设计稿的所有细节才能不负项目中所有同学的心血。这篇关于 Web 中文字体处理的方案总结,相信会让大家都有所收获,特殊字体和网页性能再也不是一道单选题了~

1KB 的 3D 游戏 ???
JS1k 这个大赛不知道有多少同学听过,在限制 1024 字节内的 JavaScript 代码完成一个参赛作品,而本期推荐的这个 3D 小游戏就出自这个比赛,很难以置信对吧,还不快进来爽一把!(顺便给大家一个小问题,如果让你来用 1KB 以内的代码完成一个 3D 小游戏,可以做到吗?)

「蒲公英」期刊,每周更新,我们专注于挖掘「基础技术、工程化、跨端框架技术、图形编程、服务端开发、桌面开发、人工智能、设计哲学、前端框架」等多个大方向的业界热点,并加以专业的解读;不仅如此,我们还会推介精选凹凸技术文章,向大家呈现团队内的研究技术方向。
抬头仰望,蒲公英的种子会生根发芽,如夏花绚烂;格物致知,我们登高远眺、沧海拾遗,以求积硅步而至千里。
往期回顾—

更多前沿技术,欢迎大家继续关注凹凸实验室公众号,小助手一直在这里等你来撩哦~

👇 查看原文,电脑端更方便阅读哦~
本文分享自微信公众号 - 凹凸实验室(AOTULabs)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。
来源:oschina
链接:https://my.oschina.net/o2team/blog/4685108