[09/12] Frontend Night

[kobayang]

• 資料の準備をがんばらない
• 参加・途中退席は自由
• スキップしない

2019/09/12 19:00~20:00

話したい・聞きたいネタを書いてく ✏️

ハッシュタグ #frontend_night

[KentoMoriwaki]

Overmind

https://overmindjs.org/api/derive?view=react&typescript=true

• state 管理のライブラリ
• codesandbox がこれを使っている。
  

[KentoMoriwaki]

Chrome 77 Beta

https://blog.chromium.org/2019/08/chrome-77-beta-new-performance-metrics.html

• meaningful
  • あいまい
  • lighthouse だと、spinner だけでも meaning だとされるかも。

Largest Contentful Paint

• 測定しやすい指標？
• より ユーザにとって、meaningful
• Largest Contentful Paint attempts to provide more meaningful data by using the largest content element as a proxy for when the main content of the page is likely visible to users.

First Input Timing

• TTI (time to interactive)
  • ページを利用するためのイベントハンドラがregister されるまでの時間G
• FIT;
  • イベントを受け付けられるようになるまでの時間
• TTI とFIT の間は？
  • ex: SSR でページ出す
    • TTI: hydration が終わったタイミング?

New Form Capabilities

• https://web.dev/more-capable-form-controls/

const form = document.querySelector('form');
// FormData event is sent on <form> submission, before transmission.
// The event has a formData property
form.addEventListener('formdata', ({formData}) => {
  // https://developer.mozilla.org/en-US/docs/Web/API/FormData
  formData.append('my-input', myInputValue);
});

Origin Trials

• https://github.com/GoogleChrome/OriginTrials/blob/gh-pages/developer-guide.md

[kdnk]

TypeScriptの似ているようで違うvoid/never型とany/unknown型の比較

https://kuroeveryday.blogspot.com/2019/09/difference-between-void-and-never-any-and-unknown.html?m=1

[KentoMoriwaki]

Google feedback on TypeScript 3.5

microsoft/TypeScript#33272

[kdnk]

jamiebuilds/unstated-next

https://github.com/jamiebuilds/unstated-next

[yamadayuki]

https://github.com/WICG/event-timing

https://developers.google.com/web/updates/2018/05/first-input-delay

[kobayang]

Origin Trials の話

Web 標準化のフィードバックサイクルを円滑にする Origin Trials について
https://blog.jxck.io/entries/2016-09-29/vender-prefix-to-origin-trials.html