Frontend Focus #528
A-Frame 1.3: 构建 WebVR 体验的框架 (opens new window) — 用于构建虚拟现实体验的 Web 框架，可在 Vive、Rift、Quest 以及桌面和移动平台（包括浏览器）中运行（如此处的演示所示）。
iOS 15.4 Beta 建议 Apple 支持来自基于 Web 的应用程序的推送通知 (opens new window) — 看起来 Apple 正在努力将基于 Web 的通知引入 iOS — 这对于一系列基于 Web 的应用程序来说将是一个真正的巨大胜利。
关于软件艺术与实践的每周对话 (opens new window) — 12 多年来，The Stack Overflow 播客一直是开发人员的目的地。主持人 Ben Popper、Cassidy Williams 和 Ceora Ford 与令人难以置信的客人聊天，探讨在软件中工作意味着什么，以及代码如何重塑我们的世界。
如何在 2022 年使用 Favicon：满足大多数需求的六个文件 (opens new window) — “是时候重新考虑 [..] 现代浏览器的网站图标并停止图标生成器了”。高级建议：用 SVG 而不是 PNG，信任浏览器以缩小规模，放弃旧的格式。这是一个很好的现代网络网站图标指南。
“常青树” 并不意味着开箱即用 (opens new window) — 在一个自动更新无处不在的时代，“我们在创建网络体验时没有一个特定的设备、浏览器和人”。在考虑更广泛的网络平台方法时，请牢记这一点。
# ⚡️ 快览:
- 如果你眯起眼睛，你会注意到 Chrome 的图标会有一点刷新 (opens new window)。
- dev-browser Polypane 的第 8 版 (opens new window) 现已推出，带来了更好的元素检查器、性能改进、强制颜色模拟、新的调试工具等。
- Web 平台正在引入 一种规范 (opens new window) 的方式来显示
<input>元素（如 “日期”、“时间”、“颜色”、“文件” 等）的浏览器选择器。 - WebKit 团队的 Jen Simmons 正在寻求有关您在 Safari 中遇到的任何 “错误和缺失功能” 的 具体反馈 (opens new window)。
- 您知道 屏幕阅读器可能会将 “M” 或 “m” 读作 “米” (opens new window) 吗？例如 3m 可能被解读为 “三米”，而不是 “三百万”。
# 📙 教程、文章 & 意见
减少 Web 的足迹：优化社交媒体 (opens new window) — 看看我们可以做些什么来减少社交媒体嵌入和社交共享小部件对环境的影响 — 加上一些完全避免它们的策略。这些也是比较好的性能提示。
用 HTML 的 <dialog> 替换 JavaScript 对话框 (opens new window) — 如何用与 alert()、confirm() 和 prompt() 方法具有相同功能的 HTML 对话框元素替换 JavaScript 对话框。
Web 框架解决了什么：Vanilla 替代品 (opens new window) — 对如何直接使用 Web 平台作为框架提供的一些解决方案的替代方案的模式给出了一些建议。
纵横比太棒了 (opens new window) — aspect-ratio 是一个不起眼的属性，但是它满足了 CSS 中期待已久的需求。
软件团队的项目管理从未如此简单 (opens new window) — Shortcut 是为开发人员构建的快速直观的项目管理。取悦 Scrum 之神并立即尝试。
创建 SVG 网格 (opens new window) — 介绍如何使用 JavaScript 和 SVG 创建一些色彩丰富的生成式网格设计，然后为它们制作动画。
CSS 动画：初学者完整指南 (opens new window) — 对于刚开始使用 CSS 的人，这涵盖了 CSS 动画规范的所有部分，并为每个功能提供了交互式演示。
深入介绍 WordPress 块主题 (opens new window)
使用 JavaScript 防止平滑滚动 (opens new window)
演示 CSS from-font 的四个例子 (opens new window)
'是的，我可以连接到 CSS 中的数据库' (opens new window)
# 🔧 代码、工具和资源
Hotkey 2.0: 按下 ”Hotkey“ 时触发元素上的操作 (opens new window) — 使用 Hotkey，在你的元素上设置 data-hotkey 属性，你就可以得到键盘快捷键。 v2.0 (opens new window) 刚刚下架。如果它足够好用在 GitHub 上，那对我们来说就太好了！
lite-youtube: 更快地呈现 YouTube 嵌入的 Web 组件 (opens new window) — 这是 Paul Irish 的 lite-youtube-embed 的 Shadow DOM Web 组件版本，具有键盘特性和其他一些不错的功能。
将 Pinterest 的 iOS 构建迁移到自动缩放的 EC2 Mac (opens new window)
Tailwind 的 DevTools：在浏览器中重新进行设计和调试 (opens new window) — 不是免费工具，但如果您希望能够在页面上试验所有 Tailwind 类，可以考虑使用一下 — 不仅仅是在构建过程中编译的那些。
CodeCaptcha.io：在小型编码挑战背后隐藏的网络链接 (opens new window) — 绝对是对验证码的独特看法。在访问链接之前，用户必须解决一个 1-3 行代码相关的任务。目前，只有 JavaScript。
Compress Images：在线压缩 WEBP、JPEG、PNG、AVIF 和 JXL 图像的快速工具 (opens new window)
ssspill：用于 “溢出” 风格 / 融化效果的 SVG 生成器 (opens new window)
- 译文出自：weekly-tracker (opens new window) 项目，期待你的加入！
- 查看原文 (opens new window)对比阅读
- 发现错误？提交 PR (opens new window)
- 译者：daodaolee (opens new window)
- 校对者：daodaolee (opens new window)