新闻

Google开发者大会(全部视频)
- 加载速度优化
  - 浏览器性能和速度提升
  - 浏览器实现了图像和 iframe 的懒加载，只需要给html元素增加属性 loading=”lazy”
  - Paint Holding 的实验功能，避免闪现纯白的“加载页面“, 【弹幕：看起来就像是点击了没反应】
  - [Web Packaging]（https://github.com/WICG/webpackage）增加了页面可以加载源，类似“P2P”
- 更强大的新特性
  - 文件系统访问 https://github.com/WICG/native-file-system
  - 无限配额 https://bugs.chromium.org/p/chromium/issues/detail?id=897276
  - 基于短信的身份验证 https://github.com/sso-google/sms-otp-retrieval/blob/master/README.md
  - Web Share Target API
  - 形状检测 API，可以实现与本次大会上发布的 Web Perception 工具包（https://perceptiontoolkit.dev/）
  - TWA 视频演示：https://youtu.be/XMaDMYjHP0Y，什么是TWA
  - 桌面版 PWA 小程序支持ChromeOS 平台 Windows、Mac 和 Linux 平台
  - comlink来使用 worker 的扫雷游戏 Proxx
- 隐私安全
  - 新策略可以让用户决定是否允许网站追踪自己，并且可以增强 Web 整体的安全和隐私保护能力，提升透明度
  - Chrome 处理 Cookie 策略的重要变化： https://blog.chromium.org/2019/05/improving-privacy-and-security-on-web.html
- 改善开发者体验
  - web.dev学习教程eg. react 和工具使用文档 eg. lighthouse
QCon大会(PPT可下载)
- 前端场里，百度amis还不错
2019 new Javasscript
- JS 解析快了 2 倍
- async 执行快了 11 倍
- 平均减少了 20% 的内存使用
- class fileds 可以直接在 class 中初始化变量不用写在 constructor 里私有变量前缀
- string.matchAll 用来做正则多次匹配
- numeric seperator 允许我们在写数字的时候使用 _ 作为分隔符提高可读性
- bigint 新的大数字类型支持
- Intl.NumberFormat 本地化格式化数字显示
- Array.prototype.flat(), Array.prototype.flatMap() 多层数组打平方法
- Object.entries() 和 Object.fromEntries() 快速对对象进行数组操作
- globalThis 无环境依赖的全局 this 支持
- Array.prototype.sort() 的排序结果稳定输出
- Intl.RelativeTimeFormat(), Intl.DateTimeFormat() 本地化显示时间
- Intl.ListFormat() 本地化显示多个名词列表
- Intl.locale() 提供某一本地化语言的各种常量查询
- 顶级 await 无需写 async 的支持
- Promise.allSettled() 和 Promise.any() 的增加丰富 Promise 场景
- WeakRef 类型用来做部分变量弱引用减少内存泄露
React Native还没完！
- Facebook App 的改版使用了 React Native,进一步扩大了 React Native 的应用范围:视频
- 在 Facebook 里面 RN 的使用很广泛，产品包括：Ads Manager, Oculus Companion, Marketplace, Dating, Jobs, Profile, Settings, Blood Donations, Crisis Response 等等
- 去年 RN 的大规模重构，使用 C++ 重写了 RN 的核心部分:https://www.youtube.com/watch?v=UcqRXTriUVI
- RN 得到了微软的大力支持，你可以用 RN 直接编写 Windows 平台的 UWP 应用
Flutter1.5来了！全平台制霸！
- Flutter 1.5：新的 App Store iOS SDK 更新、iOS 与 Material 小工具更新、引擎对于新型设备的支持，Dart 2.3 带来的全新 UI-as-code 语言功能等等
- 投资建立技术支持生态系统，目前 Flutter 项目拥有超过 2000 个可用的开源软件包
- 从移动到多平台：Flutter for Web
- 正尝试在各类嵌入式设备之上运行 Flutter 应用程序
svelte:又一个前端框架，类似 vue
- 乍看结构很像vue,一个.svelte文件里包括了 script、style、html
- 提供了一套全新的语法
- Svelte不依赖于虚拟DOM，在构建时运行
Vuex3.1.1 更新：支持 jsDelivr，修复内存泄漏
- 支持在 NativeScript 应用中调试 Vuex
- 从uglify换成Terser&支持了type=module的直接加载方式
- 支持jsdelivr
- 修复内存泄漏

技术

HTTPS的页面发送不了HTTP请求
MPEG-DASH在bilibili的应用与实践
- 自适应比特率串流技术， 2011 年 11 月成为国际标准
- 自适应码率、无缝切换、降低卡顿率
- B站在2018年9月将其全量，卡顿率对比 HTTP-FLV 有大幅降低
微信，支付宝小程序实现原理概述
- 对比了小程序和普通网页的区别
  - 运行环境不同，普通网页开发可以使用各种浏览器提供的 DOM API，进行 DOM 操作
  - 小程序渲染层和逻辑层运行在不同线程中，且渲染层存在多个WebView线程
  - 执行环境不同
- 分析了小程序为何选择hybrid技术
  - 避免单线程阻塞，用户体验好
  - 方便发布新版本
- 详细介绍了小程序的双线程模型
  - 线程之间相互独立，通过微信客户端进行通信
  - 渲染层模拟渲染层DOM树，当调用setData后通过Native层传递数据，渲染层对比新旧DOM树后更新。
- 介绍了小程序的运行&更新&事件处理机制
- 说明为什么我们要避免频繁的setData
  - setData会占用渲染层的js线程，从而阻塞事件传递到逻辑层。
  - setData会传递大量新数据

工具

即拿即用的 CSS 小功能，直接 copy 代码就能用起来
- 利用favicon展示页面加载进度
shepherd
- 做新手指引的工具库，目前对于Vue，React，Angular，Ember框架都有支持
Tickeys
- 没有机械键盘，那你就来着了

每月金句

你要避免两个陷阱。一个是尝试自动化一个不完全理解的服务，另一个是盲目地相信别人的自动化，而不理解它在幕后做的事情。