本技术日志,每周定期分享,欢迎关注、转发。

WebGL 完整攻略

从底层开始,全面了解 WebGL。这里包括完整的可编辑示例,以及 3D 渲染背后的数学知识。还有 Three.js 这类 JavaScript 库的背后原理等等。

https://xem.github.io/articles/webgl-guide.html

Electron 9.0 发布

流行的跨平台桌面应用程序框架,现在可以在 Chromium 83,V8 8.3 和 Node.js 12.14 上运行了。

https://www.electronjs.org/blog/electron-9-0

Lighthouse 6.0 的新功能

https://web.dev/lighthouse-whats-new-6.0/

Chrome 83 中面向开发者的新功能

这里有个 4 分钟的视频,涵盖了 83 版本的一些变化。

https://developers.google.com/web/updates/2020/05/nic83

Chrome 即将推出标签分组功能

https://www.blog.google/products/chrome/manage-tabs-with-google-chrome/

最新的 Safari 预览版中已支持 :where() 伪类

https://webkit.org/blog/10580/release-notes-for-safari-technology-preview-106/

文章和教程

JavaScript 的第三纪元

一篇关于 JavaScript 发展观点的讨论,有点意思,大家可以看看。

https://www.swyx.io/writing/js-third-age/

了解常用前端框架中的延迟加载

https://blog.fullstacktraining.com/understanding-lazy-loading-in-popular-frontend-frameworks/

在 React 中实现闪闪发光的文本动画

https://joshwcomeau.com/react/animated-sparkles-in-react/?utm_campaign=CSS%20Animation%20Weekly&utm_medium=email&utm_source=Revue%20newsletter

箭头函数和常规函数之间的 5 个差异

ES6 的箭头函数已经不陌生了,但这里的示例可能会有一两个,你可能是不知道的。

https://dmitripavlutin.com/differences-between-arrow-and-regular-functions/

23 年后的网站速度

大家都认为,互联网的速度已经很快了,然而网页速度似乎并没有提高多少。

https://www.nngroup.com/articles/the-need-for-speed/

嵌入式最小化 CSS 框架切换器

想要找 CSS 框架中你喜欢的东西吗?这个最小化的 CSS 框架切换器可以帮到你,在它的页面上切换“最小化 CSS 框架”下拉框,可以及时预览框架效果。

https://dohliam.github.io/dropin-minimal-css/

calc() 找到最佳行高

这是一篇灵活又有繁重数学味的文章,它介绍了更可维护的最佳行高值。

https://hugogiraudel.com/2020/05/18/using-calc-to-figure-out-optimal-line-height/

实用工具

umi-request

基于 Fetch 的现代 HTTP 请求工具。它吸取了 Axios 的优点,与 Fetch API 结合,利用了两者的优势,值得一试。

https://github.com/umijs/umi-request

Howler.js

一个现代网络音频库,使用了 Web Audio API,但可以回退到 HTML5 Audio,让音频跨平台变得容易。

https://github.com/goldfire/howler.js

new.css

一个仅使用 HTML 编写现代网站的无类的 CSS 框架,只有 4.5kb。

https://github.com/xz/new.css

Recoil

一个试验性的 React App 状态管理库,它提供了一些单独使用 React 很难实现的功能,它兼容最新版本的 React,比如 Hooks API。

https://recoiljs.org/

react-hotkeys-hook

一个可以在组件中使用键盘快捷键的 React Hook 库。

https://github.com/JohannesKlauss/react-hotkeys-hook

非常轻量的 React Select 组件。

https://github.com/tbleckert/react-select-search

use-local-storage-state

可以本地持久化数据的一个 React Hook 库。

https://github.com/astoilkov/use-local-storage-state

React Autosuggest

符合 WAI-ARIA 标准、移动友好的,且可自定义的自动输入建议的 React 组件。

https://react-autosuggest.js.org/

内容来源

关注公众号,关注前端技术

赵不寒的网络日记