Frontend Weekly Vol.58

Headlines

How to lint your Sass/CSS properly with Stylelint by Creative Nightly

最近頭角を現しているPostCSSのプラグインであるStylelintについての紹介。拡張性が高い分、設定項目も多いので、どういう設定を使っているのかや、Gulpを使ってのビルドプロセスなどにも触れているので、参考になる。

HTTP/2環境下ではリクエストはボトルネックになりにくい。コンポーネント単位のCSSのロードをさせたい所だが、状況によってはCSSOMの完成が阻害されてしまう。そこで、<body>要素下で段階的にロードすることで、よりプログレッシブに描画させるアプローチ。日本語版の意訳・解説もあるので参考に。

The Anatomy of a Frame by Aerotwist

描画処理開始からビットマップが合成されるまで、ブラウザの1フレームで何が行われているかの概要。60FPSを達成するためにも理解しておきたい。

Large Scale CSS Refactoring at trivago - trivago techblog

巨大な規模感のCSSにおけるリファクタリングのプロセスについて。アーキテクチャの例はもちろんのこと、どうやってリファクタリングを進めたのかについて細かく紹介してくれている。ありそうであまり見かけないケーススタディ。

Consistency: The Silent UX Champion — RE: Write — Medium

一貫性がもたらすUXにおける役割について。単純に「一貫していること」はゴールではなく、きちんと意味がある。その意味をしっかりと認識して、UXにおける静かなる王者である一貫性について考えるべき。

Learn React By Itself – no JSX, no Flux, no ES6, no Webpack.

React.jsを実際に使うとなると、周辺のライブラリやビルドツール、ES2015についてなど覚えることが多岐に渡る。この記事では、そういったものを 削ぎ落として、React.jsのみを使って基本を学ぼうというもの。実務ではJSXなどの助けがあるのであまり意識しないような部分もきちんと順を追って 説明している。

A Gentle Introduction to Functional JavaScript

パート4まであるJavaScriptにおける関数型プログラミング入門。非常に丁寧に解説されているので、初学者向き。

Slides/Videos

CSS Best Practices

命名規則やアーキテクチャではなく、CSSにおける基本のベストプラクティス。テストの方法やサイズ、ソースコードの順序などについて触れられている。

WebRTC Conference Japan 2016 - Google - Google Slides

先日2日間に渡って開催されたWebRTC Conference Japan 2016での初日の基調講演の資料。 WebRTCの過去と、現在進行しているアップデートの内容を分かりやすく紹介。

Announcement

フロントエンドエンジニアのための現在とこれからの必須知識 (PR)

フロントエンドを1、2年以上担当した人を対象に、「今知っておかないといけない情報」と、「今後役に立つ情報」をピックアップ。

Frontend Weeklyのキュレータの1人である谷と編集長の斉藤も著者の1人。

Slack for Frontend Weekly (PR)

Frontend Weeklyの『実験的』Slackコミュニティに興味がある方は、こちらから招待をリクエストしてください。 週次で50人くらいずつ招待をして行くつもりです。

In Brief