2016-01-26

ReactとクリティカルパスCSS

Reactを用いたUniversal(Isomorphic)なサイトのクリティカルパスCSSを自動化したい。

以前Nunjucksを使用したパターンはうまく機能したので、同様の手法でReactの実装を考えた。
すなわち、Cssの更新にフックしGulp経由で静的なHTMLを生成し、それに対してCriticalを実行させクリティカルパスの部分を別のHTMLとして抽出し、インポートするという手法であった。

しかし、Critical 0.7.0がリリースされPenthouseのようにURL指定にて実行が可能になった。
というよりPenthouseを内蔵した様子。

ともかくこれによりCriticalと変わらぬ実行結果をURL指定で取得できそうなので、ぜひこの機能を利用したい。