JSer.info #411 - "Lets Build Web Components!"というWeb Componentsについての連載記事が公開されています。
- Lets Build Web Components! Part 1: The Standards - DEV Community 👩💻👨💻
- Lets Build Web Components! Part 2: The Polyfills - DEV Community 👩💻👨💻
- Lets Build Web Components! Part 3: Vanilla Components - DEV Community 👩💻👨💻
- Lets Build Web Components! Part 4: Polymer Library - DEV Community 👩💻👨💻
- Let's Build Web Components! Part 5: LitElement - DEV Community 👩💻👨💻
- Let's Build Web Components! Part 6: Gluon - DEV Community 👩💻👨💻
Web Componentsの基本的な使い方、Polyfill、ライフサイクル、スタイルなどについて解説しています。
また、PolymerやGluonjsといったフレームワークを使ったコンポーネント開発などについても書かれているためかなり幅広い内容になっています。
Idiomatic Redux: The History and Implementation of React-Redux · Mark's Dev Blogという記事では、ReduxのメンテナーのMark EriksonがReact Reduxの歴史と実装について紹介しています。
v5までのReact Reduxの実装とv6 β実装されたContext APIベースの実装やパフォーマンスの問題についても書かれています。
また今後の話として、ReactのHooks APIを使った実装の提案などについても書かれています。
HTTP/2 explainedの著者でもあるDaniel StenbergによるHTTP/3 explainedが公開されています。
この書籍ではHTTP/3について解説されています。
HTTP/3自体がまだ策定中であるため、この書籍もまだ更新が予定されています。
また、ソースコードもGitHubで公開されています。
アーティクル
Lets Build Web Components! Part 1: The Standards - DEV Community 👩💻👨💻
dev.to/bennypowers/lets-build-web-components-part-1-the-standards-3e85
Web Componentsについての連載。
Web Componentsの構成要素、polyfill、読み込み方法、ライフサイクル、非同期ロード。
また:hostや<slot>、スタイル、アクセシビリティ、Polymerなどのフレームワークについて
WebSockets - A Conceptual Deep-Dive | Ably Realtime
www.ably.io/concepts/websockets
WebSocketについての記事。 Cometのようなポーリングによる通信、WebSocketによるハンドシェイクについて。 WebSocketを使っての接続方法や著名なライブラリの紹介など
Idiomatic Redux: The History and Implementation of React-Redux · Mark's Dev Blog
blog.isquaredsoftware.com/2018/11/react-redux-history-implementation/
react-reduxの歴史と今後について
今までのreact-reduxの実装とv6 β実装されたContext APIベースの実装。
また、React Hooksを使った実装のProposalについてなど
ZEIT – ncc: Node.js Compiler Collection
Node.jsのプログラムを依存含めて1つのファイルにするnccについて。
ファイル1つにまとめることで配布性や実行時の起動時間のI/Oオーバヘッドの改善を目的としている。
Malicious code found in npm package event-stream downloaded 8 million times in the past 2.5 months | Snyk
snyk.io/blog/malicious-code-found-in-npm-package-event-stream
[email protected]とflatmap-streamの問題について。
flatmap-streamにwalletsからbitcoinを盗むコードが含まれており、[email protected]がこのパッケージに依存していた問題について。
現在flatmap-streamはnpmからunpublishされている
- I don't know what to say. · Issue #116 · dominictarr/event-stream
- statement on event-stream compromise
How we made Carousell’s mobile web experience 3x faster
medium.com/carousell-insider/how-we-made-carousells-mobile-web-experience-3x-faster-bbb3be93e006
carousellにおけるパフォーマンス改善について。
PRPLパターン、Critical CSS、Lazy LOading、画像の圧縮とCDN、Service Workerの導入などについて
フロントエンド向けvalidator: favalidの紹介 - asterisc
akito0107.hatenablog.com/entry/2018/11/23/195538
バリデーターを関数で書いてcombineできるライブラリのfavalidについて
スライド、動画関係
seo_for_spa.pdf - Speaker Deck
speakerdeck.com/kazuyaseki/seo-for-spa-cfb3706f-ae1d-4c6f-a83f-96dc2452f32b
Google botに適切に解釈されるようにするための手法についてのスライド。
Google botがChrome 41相当であることによる制限、タイムアウトの検証、Dynamic Rendering(prerender)やSSRなどの対策についてなど
Angular Webアプリケーションの最新設計手法.pdf - Speaker Deck
speakerdeck.com/koumatsumot0/angular-webahurikesiyonfalsezui-xin-she-ji-shou-fa
Angularのコンポーネント設計やステート管理についてのスライド
PWA導入の成果と課題 / nikkei-pwa-html5conf2018 - Speaker Deck
speakerdeck.com/sisidovski/nikkei-pwa-html5conf2018
PWAの導入と運用しての課題についてのスライド。
Service Workerによるパフォーマンスの改善、Add to HomeScreenのハンドリング、Performance Budgetの設定方法とパフォーマンス監視などについて
HTTP and 5G (fixed1)
www.slideshare.net/dynamis/httpp-and-5g-fixed1
5G環境での通信試験についてのスライド。
5Gの試験環境における輻輳制御方法CUBICとBBRの比較、HTTP/1、HTTP/2、QUICの比較などについて
Class features in NodeFest Japan - Google スライド
docs.google.com/presentation/d/1nsR7QnPlyhlPj1ff4cYyARwcWrYM1j_fM7dpbFZM3K8/mobilepresent#slide=id.p
ECMAScript ProposalのPrivate fieldsについてのスライド。
privateを実現するための構文として#variableを使う理由や経緯、構文、現在のStageについてなど
サイト、サービス、ドキュメント
google/js-green-licenses: JavaScript package.json License Checker
github.com/google/js-green-licenses
package.jsonにかかれている依存ライブラリのライセンスチェックツール。
Pull Reuqest対するチェックなども対応している
KidkArolis/jetpack: 🚀 Jetpack – a more convenient webpack dev server.
webpackベースの開発サーバ、ビルドツール。
Parcelのようにデフォルトの設定があり、設定なしで利用できることを目的としている。
wasmerio/wasmer: High-Performance WebAssembly JIT interpreter
WebAssemblyファイル(.wasmと.wat)を実行できるスタンドアローンなツール。
Introduction · HTTP/3 explained
HTTP/3とQUICについての解説ドキュメント。
TCPとUDP、HTTP/2との違い、QUICの仕組みなどについて
ソフトウェア、ツール、ライブラリ関係
developit/htm: Hyperscript Tagged Markup: JSX alternative using standard tagged templates, with compiler support.
JSXライクなTagged Templatesライブラリ。babelプラグインでコンパイルも可能になっている。
areknawo/Rex: Your RegEx companion.
メソッドチェーンで正規表現を作成したり、マッチング、置換するライブラリ
boneskull/create-yo: Use any Yeoman generator with "npm init"
github.com/boneskull/create-yo
npm init yo <generator>できるYoeman向けのツール
