JSer.info #322 - Firefox 52.0がリリースされました。
WebAssemblyのデフォルト有効化、CSS Gridやrel="noopener"、async/awaitのサポート、Unicode code pointを識別子として利用できるようになるなど
- Firefox 52.0 リリースノート
- Firefox 52 for developers - Mozilla | MDN
- Firefox 52 サイト互換性情報 | Firefox サイト互換性情報
- Firefox 52 が正式リリース、WebAssembly、CSS Grid Layout の実装、レスポンシブデザインモードの拡充など盛りだくさん | WWW WATCH
FirefoxのECMAScriptのサポート状況については下記の記事でまとめられています。
Polymer 2.0 Release Candidateが公開されています。
Custom Element v1やShadow DOM v1の仕様に追従した変更がされています。
ES2015 classesの対応、ライフサイクルの変更、is属性サポートの廃止、データ変更検知の仕組みの変更などが含まれています。
1.xから2.0へのマイグレーションガイドも公開されているのであわせてみると良さそうです。
Moving Airbnb Search to React – Airbnb Engineering & Data Science – Mediumという記事では、Airbnbの検索ページがFlightからReactへ移行した際の話が書かれています。
テストがなく、読むのにも時間がかかるコードベースを新しくReactで書き直すリファクタリングの戦略について書かれています。
移行する際に、FlightのeventsをReactのPropsに繋ぐ仕組みを作成したり、
リファクタリングによる(パフォーマンスの)リグレッションをどうやって検知し抑えるかという点について書かれています。
AirbnbにはExperiment Reporting Frameworkという内製のパフォーマンスメトリクスを取得するツールがあり、このレポートを見ながらリファクタリングを行った話が紹介されています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Release Notes for Safari Technology Preview 25 | WebKit
webkit.org/blog/7432/release-notes-for-safari-technology-preview-25/
Safari Technology Preview Release 25リリース。
Apollo Client 1.0 is coming
dev-blog.apollodata.com/apollo-client-1-0-is-coming-23b74b13fbbb
GraphQLクライアントのApollo Client 1.0リリース
Firefox 52.0 リリースノート
www.mozilla.jp/firefox/52.0/releasenotes/
Firefox 52.0リリース。
wasmのデフォルト有効化、CSS Gridのサポート、
rel="noopener"のサポート、async/await、Unicode code pointを識別子として利用できるようになるなど
- Firefox 52 for developers - Mozilla | MDN
- Firefox 52 サイト互換性情報 | Firefox サイト互換性情報
- Firefox 52 が正式リリース、WebAssembly、CSS Grid Layout の実装、レスポンシブデザインモードの拡充など盛りだくさん | WWW WATCH
qunit/History.md at 2.2.0 · qunitjs/qunit
github.com/qunitjs/qunit/blob/2.2.0/History.md
QUnit 2.2.0リリース。
1つ以上のテストがFailのときはPassし、Todoのみが残った時はFaillする
QUnit.todoの追加、通った順序を記録し検証するassert.step()とassert.verifyStepsを追加など
Release Inferno 1.4.0 · infernojs/inferno
github.com/infernojs/inferno/releases/tag/1.4.0
Inferno v1.4.0リリース。
SVGのサポートを修正、optimize-jsの対応など
Welcome 2.0 Release Candidate! - Polymer Project
www.polymer-project.org/blog/2017-03-08-2-0-rc
Polymer 2.0.0 RCリリース。
Custom Elements v1、Shadow DOM v1の仕様に追従した変更が含まれてる。
ES2015 classesの対応、ライフサイクルの変更、
is属性サポートの廃止、データ変更検知の仕組みの変更など
アーティクル
Inroducing Almin 0.10.0: TypeScript, FlowType, Logger | Web Scratch
efcl.info/2017/03/08/almim0.10/
FluxライブラリのAlmin 0.10.0リリース。
コードベースをTypeScript化、FlowTypeのサポート改善、開発用のロガーの改善など
MobXを使ったアーキテクチャについて - console.lealog();
lealog.hateblo.jp/entry/2017/03/08/114017
State管理ライブラリであるMobXについて。
Native ECMAScript modules: nomodule attribute for the migration
blog.hospodarets.com/native-ecmascript-modules-nomodule
scriptタグの
nomodule属性についてモジュールをサポートしてない環境でのみ実行されるscript要素で、fallbackを行う方法について
A Complete Guide to CSS Grid | Codrops CSS Reference
tympanus.net/codrops/css_reference/grid/
CSS Gridについての詳しい解説
Moving Airbnb Search to React – Airbnb Engineering & Data Science – Medium
medium.com/airbnb-engineering/moving-airbnb-search-to-react-b85b815e166c
Airbnb SearchがTwitter’s FlightからReactに移行した話。
何を指標にしてリファクタリングを行うかについて。
内製のパフォーマンス計測し検証しながら移行するアプローチについて
薄いフレームワーク指向の Web クライアントサイドプログラミング - Hatena Developer Blog
developer.hatenastaff.com/entry/2017/03/10/190229
MVPアーキテクチャパターンを使ったフレームワークを使わないアプリケーション設計について。
View/Presenter/Modelに役割を分担したクラスを扱う方法について
Introduction to Web Audio API | CSS-Tricks
css-tricks.com/introduction-web-audio-api/
Web Audio APIについてのチュートリアル。 どのようなAPI体系であるか、OscillatorNodeを使っての解説、Web Audio APIにおける時間の扱いなどについて
スライド、動画関係
14 Must Know Chrome Dev Tools Tricks - YouTube
www.youtube.com/watch?v=xkzDaKwinA8
Console APIについてのスクリーンキャスト
WAI-ARIAの考え方と使い方を整理しよう
www.slideshare.net/nozomisawada969/waiaria-72900338
WAI-ARIAについてのスライド。
aria-*属性、role属性の使い分けや意味合いについて。ランドマーク、文書構造、ウィジェット、ライブ領域、tabindex属性などについて
Angular 4がやってくる！？ 新機能ダイジェスト
www.slideshare.net/masahikoasai/20160306-angular-4
Angularのアップデートライフサイクルについてのスライド。
Angular 2.xからsemverに準拠したアップデートとなり、4.xへのメジャーアップデートどのような点が変わるのかについて。
機能追加やアップデート方法について
サイト、サービス、ドキュメント
Point | A flexible CSS Framework for building modern responsive web apps
Flexboxを使ったモバイルファーストなCSSフレームワーク
ソフトウェア、ツール、ライブラリ関係
brave/muon: Build browsers and browser like applications with HTML, CSS, and JavaScript
BraveのElectron fork。
Chromiumのソースを直接使うように、Chrome extensionsのサポート、renderer processからNode.jsを完全に除去するのが目的
hyperapp/hyperapp: 1kb JavaScript library for building frontend applications.
JSX/Hyperxを使ったDOM記述、Router、State管理をまとめて扱えるライブラリ
staltz/html-looks-like: Assert that an HTML string looks approximately the same as another HTML
github.com/staltz/html-looks-like
HTML文字列同士を大まかに比較できるテストライブラリ。
BafS/Gutenberg: Modern framework to print the web correctly.
印刷向けのCSSライブラリ
Sazerac
データにフォーカスしたassertion/テストライブラリ。
Jasmine、Jest、Mochaと一緒に動作する。
データごとのテストケースを作るようなパラメタライズドテストを行える。
書籍関係
Electronではじめるアプリ開発 ～JavaScript/HTML/CSSでデスクトップアプリを作ろう：書籍案内｜技術評論社
gihyo.jp/book/2017/978-4-7741-8819-5
2017年3月28日発売
Electronについての書籍
