新闻

Chrome 79发布
- 新特性:
  - Web XR
    可以使用WebXR Device API为智能手机和头戴式显示器创建沉浸式体验
  - Wake Lock API(实验性)
    - 请求页面锁定，防止屏幕变暗或启动屏幕保护程序
    - 调用navigator.wakeLock.request()
    - 进入全屏、最小化、窗口切换时，会自动释放锁
  - rendersubtree属性，没太懂
    有时候，不希望部分DOM立即呈现。例如，滚动条中包含大量内容，或者在任何给定时间仅显示部分内容的选项卡式UI。
    - 新rendersubtree属性告诉浏览器可以跳过渲染该子树。这使浏览器可以花更多时间处理其余页面，从而提高性能。
    - 当rendersubtree设置为时invisible，不对元素的内容进行绘制或命中测试，从而可以进行渲染优化。
    - 将rendersubtree改为activatable，可以通过删除invisible属性并呈现内容来使内容可见
  - 标签冻结
    - 卸载所有超过五分钟不活动的选项卡。这样可以为其他选项卡或其他本地运行的应用程序释放CPU和RAM系统资源。
    - 当用户再次切换回该标签页时，则会自动刷新重载
    - 会排除掉一些特殊的情景，比如说如果非活动标签页正在播放音视频内容，那么标签页即便是超过五分钟没有活动也不会被释放资源，这样避免在收听内容时出现中断
    - 默认不开启，可以在 chrome://flags 中找到 #proactive-tab-freeze 进行开启
  - 密码检查
    - Google会获取您所有与Chrome同步的密码，并检查是否有其他在线服务导致其泄露
    - 此前，密码检查仅作为单独的Chrome扩展程序或Google Web仪表板中的部分提供。从Chrome 79开始，Password Checkup已集成到Chrome本身。要使用它，Chrome用户必须在Chrome中登录其Google帐户
    - 尚未在 Chrome 79 全量上线，即便在 chrome://flags 中开启了相关的功能标签（chrome://flags/#password-leak-detection）选项也无法直接激活相关设置，因此我们推测这可能是一项服务器端更新
  - 实时将不良网站列入黑名单
    - 此前，Chrome每30分钟下载一次已知不良网站的列表。但是，Google表示，近几个月来，黑客利用这一30分钟的延迟，以更快的速度改变站点和域
    - Google表示Chrome将在“同步和Google服务”部分提供一个新选项，使用户能够实时扫描不良站点。
  - 禁止加载HTTPS“混合内容”
    - 从今年12月开始测试的 Chrome 79开始，Chrome将会逐步阻止所有混合内容。到2020年1月，Chrome 80会将所有混合音频和视频资源自动升级为HTTPS，如果无法通过HTTPS加载，则将自动被阻止。最终，在2020年2月，Chrome 81将所有混合图像、音频与视频自动升级为HTTPS，并且阻止那些无法通过HTTPS加载的图像。
  - 后退按钮缓存(实验性)
    - 此功能的作用是为“后退和前进” Chrome按钮创建特殊的缓存。如果用户在浏览历史记录中前进或后退，则将从此缓存加载页面，而不是从头开始加载。
- 还有个小插曲：
  - Android平台(79.0.3945.79)使用webview框架搭建的app遭遇数据清空问题
  - google调整了缓存位置，却没有同步迁移旧数据，导致无法访问
倏忽一年：回顾点评前端 2019 重大事件、趋势
- 完全支持 iOS 13 暗色模式
- 改进的 Add-to-App 体验
  将 Flutter 集成到已有 Android 或 iOS App 的能力
- Dart 2.7
- 提供了 Web 支持（beta 版）和 macOS 支持（alpha 版）

技术

react hook专题
如何使用 docker 部署前端应用
Kubernetes 儿童插图指南
用可视化的方式，学习 JavaScript 引擎
- html解析器，下载script二进制字节流
- 字节流解码器，字节流 -> js源码
- 解析器parser，源码 -> AST
- 解释器interpreter，AST -> Bytecode
- 编译器compiler，Bytecode -> machine code(其实是汇编语言)
解密 VS Code 断点调试的原理

文章

我们是如何将网站加载时间减少24%的？
- 中文翻译
- 优化原因：
  1. 良好的用户体验——即加载时间更短（且互动性更好）和使用时的愉悦感 ;
  2. SEO—— 我们的流量严重依赖谷歌搜索，而且你也许知道谷歌比较青睐性能良好的网站（谷歌甚至在搜索控制台中引入了速度报告）。
- 常用的性能优化方法：
  1. 静态资源使用 CDN 并配置合理的缓存时间；
  2. 优化图片尺寸和格式；
  3. 使用 Gzip 或 Brotli 压缩；
  4. 减少非关键的 JS 和 CSS 代码的大小。
- 他们还用了：
  1. 引入了 react-window 来每次渲染 10 个列表项，而不是 250 个
  2. 针对 JSON 数据使用 rel="preload"
  3. 在服务端实现超简单的缓存？没太明白
  4. 移除不必要的字体
- 注意：对缓存初始 HTML 和动态 API 的想法将信将疑，但请考虑：
  首先，他们的接口不会频繁改动——每天批量添加一次新的职位；
  其次，他们在改动发生时，在程序中清除了缓存。
git rebase 是有害的
- rebase的黄金法则：永远不要在公共分支进行rebase
美团外卖前端容器化演进实践
解密国内BAT等大厂前端技术体系-携程篇

2019-12前端月报

新闻

技术

文章

教程

工具

本周金句