https://mp.weixin.qq.com/s/ixMp0Jqc_sfNMPDrCYnPPw
使用 CSS Houdini 可以在 CSS 中使用 JS 代码,类似在 CSS 中使用 canvas 画一些图案,但是是在 CSS 的生命周期中实现,所以可以获取到全局状态变量等。这个文章是实现了一种波浪的效果。
https://chrome.google.com/webstore/detail/swiftread-read-faster-lea/ipikiaejjblmdopojhpejjmbedhlibno
朗读网页上的文章的浏览器插件。
https://www.readmargins.com/p/doordash-and-pizza-arbitrage
之前听说类似的故事,餐厅没有加入外卖平台,但是用户却可以下单,这是平台私人行为,如果数据很好,它会拿着这个数据去餐厅要求加入,抽取费用。它们甚至会赔钱做这个测试,就是为了拿到更好的数据。
https://twitter.com/akella/status/1601169580055203846
简单介绍了下如何实现下面这种网站的方案。很酷的是,它的翻页效果是 WebGL 的视频,内容则全是 HTML + CSS 实现的。
https://emiozaki.com/works?type=grid
做的很好看的个人网站,风格像是手机上的漫画,切换做的十分丝滑。
https://calendar.perfplanet.com/2022/lcpfe/
LCP 会受到网络因素影响,如果要优化 LCP 为什么不直接优化减去网络因素的时间呢。
https://www.lydiahallie.io/blog/optimizing-webfonts-in-nextjs-13
字体的性能优化方案,手段主要是两个方面
- 提前建立连接,提前字体资源请求
- 使用 size-adjust 来保证字体切换中,页面的闪烁
- next/font 可以帮助你更好的实现第一个方案