Google IO 2019 Web Recap by Jxck

Transcript

1. Web Recap #io19jp #io1pjp 2019/5/18 Jxck

2. None

3. 3 Lazy Loading img/iframe <img loading=eager> <img loading=lazy > <img

   loading=auto >

4. 4

5. 5 Portals <portal src=url>

6. 6

7. 7 Singned HTTP Exchanges

8. 8 Project Fugu 48

9. 9 Close the Gap with Native • God 7 ◦

   Writable Files API ◦ Badging API ◦ Wake Lock API ◦ Shape Detection API ◦ Periodic Background Sync ◦ Contact Picker API • Graduated ◦ Web Share API • Students ◦ https://bugs.chromium.org/p/chromium/issues/list?q=label:Proj-Fugu

10. New JS Features 10

11. class field 11 class Counter { constructor() { this.count =

    0 } increment() { this.count ++ } display() { console.log(this.count) } } class Counter { count = 0 increment() { this.count ++ } display() { console.log(this.count) } }

12. Promise.{allSettled, any} 12 Promise.all: 一個でも失敗したら止まる Promise.allSettled: とにかく全部やる Promise.race: 一個成功/失敗したら止まる Promise.any:

    一個成功したら止まる

13. Intl 13 intl = new Int.RelativeTimeFormat('ja') intl.format(-1, 'day') // "昨日"

    intl = new Intl.DateTimeFormat('ja-JP-u-ca-japanese', {era:'long'}) intl.format(Date.now()) // "令和1年5月19日" intl = new Intl.ListFormat('ja-jp') intl.format(['あれ', 'これ']) // "あれ、これ" intl = new Intl.ListFormat('en') intl.format(['あれ', 'これ']) // "あれ and これ"

14. BigInt 14 // JS の Number の最大値 big = Number.MAX_SAFE_INTEGER

    // 9007199254740991 (2^53-1) big = 9999999999999999999999999999n big = BigInt("0xffffffffffffffff") big = BigInt(Number.MAX_SAFE_INTEGER) ^ 2n

15. Googlebot to latest Chromium 15

16. Paint Holding 16

17. 17 Google Fonts + font-display 大きなフォントを落としてる間、システムフォントで表示できる。

18. 18 explanation • Signed HTTP Exchange ◦ https://blog.jxck.io/entries/2018-12-01/signed-http-exchanges.html • JS

    Private Field ◦ https://blog.jxck.io/entries/2019-03-14/private-class-field.html • Web Font display: swap ◦ https://blog.jxck.io/entries/2017-12-06/font-display.html • Portal ◦ https://mozaic.fm ◦ https://labs.jxck.io/portals • Lazyloading ◦ https://blog.jxck.io ◦ http://labs.jxck.io/lazyload/

19. Jack thanks