「Mercari Engineering」は メルカリのエンジニアに関する情報を、 オープンに公開・共有していくためのサイトです。
メルカリエンジニアリング
「Mercari Engineering」は メルカリのエンジニアに関する情報を、 オープンに公開・共有していくためのサイトです。
HTML要素からHTTP/2優先度を指定する Priority Hints - ASnoKaze blog
20180912追記 Chrome71で動作確認しました。 仕様的にも変更が入ってるので、下記記事参照 asnokaze.hatenablog.com HTTP/2ではリクエストは並列的に行われますが、クライアントは各リクエストに優先度を設定できます。サーバはこの優先度によって、レスポンスの順番(正確にはレスポンスを返すのに使用するリソース)を、制御しています。 この優先度の設定はブラウザが自動で行っており、Webエンジニアは意識する必要はありません。例えばレンダリングを開始するのに必要なCSSなどは優先度が高く、画像などは優先度が低く設定されるのが一般的です。 しかし、Webエンジニアが明示的にHTML要素にどの優先度でリクエストするか指示したい場合でも現状は出来ません。例えば、ユーザの閲覧目的が特定の画像である場合や、特定のJavaScriptがコンテンツに重要ということもあるかもしれ
Building the DOM faster: speculative parsing, async, defer and preload – Mozilla Hacks - the Web developer blog
Building the DOM faster: speculative parsing, async, defer and preload In 2017, the toolbox for making sure your web page loads fast includes everything from minification and asset optimization to caching, CDNs, code splitting and tree shaking. However, you can get big performance boosts with just a few keywords and mindful code structuring, even if you’re not yet familiar with the concepts above
HTML の省略によるサイズ最適化 | blog.jxck.io
Intro 本サイト blog.jxck.io 以下については、 Markdown から静的ファイルを生成するスタイルで作成している。 この変換時に以前から思っていた HTML の最適化 を実施することにした。 しかし、 md->html 変換時にそれをできるツールが見当たらないため、 Markdown の AST から HTML を構築する過程で、省略を施すスクリプトを自作した。 ただし、ソースはあくまで観賞用なので、インデントやコメントは残している。 チューニングではなく単なる実験としてサイト全体にこれを適用し、その結果を記す。 静的コンテンツの最適化 パフォーマンス改善の常套手段として、コンテンツの最適化がある。 ただ、ここ最適化と言っているものには大きく二つある。 gzip などのアルゴリズムにより経路上で圧縮する bmp を png, jpeg, webp などのフォーマットに変
リフロウとリペイント：CSSがjavascriptのパフォーマンスの足をひっぱっている？(を読んだメモ） - 今日もスミマセン。
Stubbornella ? Blog Archive ? Reflows & Repaints: CSS Performance making your JavaScript slow? 上記エントリをテキトーに解釈して要点をメモってみた。 リペイント(repaint) 要素のスキン見た目、が変化したときに発生。 ただしレイアウトには影響しない。 outline visibility background color など、 Operaのレポートによると、リペイントは処理コストが高くつくらしい。 なぜなら、DOMツリー内の他のノード（要素）全ての見た目について検証しなければいけないから。 リフロウ(reflow) リフロウはパフォーマンスにとってさらに重要。 なぜなら、それによってページの一部（あるいは全体）のレイアウトの変更を引き起こすから。 たとえば、下のようなHTMLがあったとした
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - addyosmani/critical: Extract & Inline Critical-path CSS in HTML pages
