JSer.info #454 - iOS 13、macOS 10.14.5(Mojave)に搭載されるSafari 13のリリースノートが公開されています。
Web Authentication APIを使ったFIDO2のセキュリティキーに対応、__Secure-と__Host-のクッキーprefixのサポート、Pointer EventsやVisual Viewport APIのサポートなどが行われています。
iOS 13のSafariでWebDriverのサポート、ITP 2.3へのアップデート、WebSQLの削除なども含まれています。
Chrome 78 Betaがリリースされました。
CSS Custom Propertiesを使ったアニメーションのサポート、Native File System APIとSMS Receiver APIのorigin trialでのサポートが含まれています。
- Smarter custom properties with Houdini’s new API | web.dev
- The Native File System API: Simplifying access to local files | Web
WebSocketsにおけるArrayBufferのダウンロード速度の改善、performance.markなどに対してメタデータを付与できるUser Timing API Level 3のサポートもふくまれています。
また、unload時にはポップアップやSync HXRが禁止されるなどの制限の追加、MSEdgeに引き続いてXSS Auditorが廃止されています。
- Google deprecates XSS Auditor for Chrome | The Daily Swig
- What’s new in Microsoft Edge in the Windows 10 October 2018 Update - Microsoft Edge Blog
デザインシステムツールであるStorybook 5.2がリリースされました。
UIコンポーネントに対してMDXを使ってドキュメントを書けるDocsPageという機能が追加されています。
詳しくは次の記事でも解説されています。
今までは、Stroy#addのようなAPIでストーリを記述する形式でした。
storiesOf('atoms/Button', module)
.add('text', () => <Button>Hello</Button>)
.add('emoji', () => <Button>😀😎👍💯</Button>);
Storybook 5.2ではこれに加えてComponent Story Format (CSF)というストーリの形式がサポートされました。
CSFはストーリーをモジュールとしてexportすることで表現できるようになっています。
export default { title: 'atoms/Button' };
export const text = () => <Button>Hello</Button>;
export const emoji = () => <Button>😀😎👍💯</Button>;
詳細は次の記事で書かれています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Moving Firefox to a faster 4-week release cycle - Mozilla Hacks - the Web developer blog
hacks.mozilla.org/2019/09/moving-firefox-to-a-faster-4-week-release-cycle/
Firefoxのリリースサイクルが7週ごとから4週ごとへと変更される予定について。
一方でFirefox ESRのリリースサイクルは変更されない。
Safari 13 Release Notes | Apple Developer Documentation
developer.apple.com/documentation/safari_release_notes/safari_13_release_notes
Safari 13の変更点について。
FIDO2のセキュリティキー、__Secure-と__Host-のクッキーprefix、Pointer Events、Visual Viewport APIのサポートなど。
iOS 13のSafariでWebDriverのサポート、WebSQLの削除など
jasmine/3.5.0.md at master · jasmine/jasmine
github.com/jasmine/jasmine/blob/master/release_notes/3.5.0.md
Jasmine 3.5リリース。
toHaveBeenCalledWithのエラー結果の出力の改善、resolveToとrejectWithの追加、カスタム非同期Matcherを定義するaddAsyncMatchersの追加など
Chromium Blog: Chrome 78 Beta: a new Houdini API, native file system access and more
blog.chromium.org/2019/09/chrome-78-beta-new-houdini-api-native.html
Chrome 78 Betaリリース。
CSS Custom Propertiesを使ったアニメーションのサポート、Native File System APIとSMS Receiver APIのorigin trialの開始など。
WebSocketsにおけるArrayBufferのダウンロード速度の改善、User Timing API Level 3のサポート。
また、Sync HXRがunload時などには禁止、XSS Auditorの削除など
Storybook 5.2 - Storybook - Medium
medium.com/storybookjs/storybook-5-2-794958b9b111
Storybook 5.2リリース。
MDXを使ったドキュメントを書けるDocsPageの追加、Storyをモジュールとして作れるCSFのサポート。
TypeScriptのサポート、React Hooksのサポート、 Standalone modeなど
アーティクル
Fresher service workers, by default | Web | Google Developers
developers.google.com/web/updates/2019/09/fresher-sw
Chrome 78ではimportScriptで読み込むファイルも変更があればHTTP Cacheはデフォルトで無視されるようになった。
Chrome 68で追加されたupdateViaCacheオプションを使ってHTTP Cache-Controlを見るかを制御できる。
Practical Ways to Write Better JavaScript - Stack Overflow Blog
stackoverflow.blog/2019/09/12/practical-ways-to-write-better-javascript/
より良いJavaScriptを書くためにどうするかという記事。
TypeScriptを使う、ES2015+の機能を活用する、分散を考える。
Lint、テストを行うなどについて
✩ Wikipedia's JavaScript initialisation on a budget
phabricator.wikimedia.org/phame/live/7/post/175/wikipedia_s_javascript_initialisation_on_a_budget/
Wikipediaの初期表示に読み込むJavaScriptのファイルサイズを削減した話。
目標のbudgeを28KBと設定してどのように初期ロードのJavaScriptサイズを減らしていったかについて
Intelligent Tracking Prevention 2.3 | WebKit
webkit.org/blog/9521/intelligent-tracking-prevention-2-3/
Safari 13(iOS 13/macOS Catalina)に実装されたITP 2.3について。
CookieからLocalStorageに保存場所を移行したサードパーティトラッカーに対する制限の追加、document.referrerにもeTLD+1の制限を追加、デバッグモードの改善など
Techniques to make a web app load fast, even on a feature phone
web.dev/load-faster-like-proxx/
PROXXのローディングパフォーマンスに利用したテクニックの紹介記事。
WebPageTestを使ったリソースロードのwaterfall分析、コネクション数の削減、preload、prerendering、CSSのインライン化、Code Splittingなどについて
スライド、動画関係
Backbone.Model に 型をつけて剥がす - Typing to destroy Backbone.Model - Speaker Deck
Backbone.Modelに型をつけてリファクタリングしていく話。
Backbone.ModelをただのJSONとして扱い、JSONのスナップショットに対してテスト行う
ソフトウェア、ツール、ライブラリ関係
faboulaws/fakingoose: An automatic fixture generator for mongoose using the schema definition
github.com/faboulaws/fakingoose
データスキーマからダミデータを生成してくれるライブラリ
