HTTP
AsyncのリクエストなくしてAd serverにする imageサーバ、ホスト名2台 minify js combine js and css gzip js and css bottom js css sprite ブロードメディアのExpiresが全部1weekってのはどうだろう。10年くらいでもいんじゃね。 ブロードメディアのETagを…
CSSで指定している画像をCSS sprite化する http1.0で並列処理。でもkeep-aliveあればhttp1.1のほうがいいよ。 googleではdeferを使用。jsあとで読み込め！ってやつ。 <script type="text/javascript" defer></script>
パッシブリクエスト 将来的な必要性を見越して発行。次、使うでしょってために先にリクエストしておくもの アクティブリクエスト そのときに利用者のアクションに応じて発行 ここでは今までのルールがAjaxのXMLRequestでも同様に守られているかをチェック Ex…
2つ以上のサーバでホストしているとキャッシュの障害になる ETagとは エンティティタグ。キャッシュされてるコンポーネントの有効性を検証するたにブラウザとwebサバが使用する仕組み。 最終更新日よりも柔軟な仕組みを取り入れるために採用された 条件付き…
複数作業者でHTMLなど書いていると重複させてしまうこともある。 重複したjsがあれば、2度のダウンロード、実行がされる。キャッシュされてても、ページの更新(F5)では条件付GETで2度リクエストされることになる。 重複をチェックするようなコードを入れ込む…
リダイレクトもスクリプト同様に次のコンポーネントがダウンロードされるのを止めちゃう 末尾スラッシュの欠如 実はhttp:www.hmv.co.jp/musicはhttp:www.hmv.co.jp/music/にリダイレクトしてる。/を追加するためにね。 対応 Aliasで定義しておく 対応 mod_re…
縮小化 コメント、スペース、空白、改行取り除く。 ツール JSMin, ShrinkSafe, Dojo 難読化 縮小化したあとにさらに、変数名を一文字にしたり、1byteでも削る。 だだし難読化はバグを助長しやすい。 圧縮をするとさらに小さくなる 縮小化プラスgzip！これ最…
DNSキャッシュはTTLを持つ。TTLはどれだけキャッシュしとくかって数値。でもこれとは別にブラウザは独自でキャッシュタイムを持ってる。 IE DnsCacheTimeout: 30min KeepAliveTime: 1min ServerInfoTimeout: 2min Firefox network.dnsCacheExpiration: 1min …
実はインラインのほうがHTTPリクエストは1回で済むからやっぱ高速なんだよね。 だけど、キャッシュできんだからやっぱ外部のほーがはやいじゃん。 サイトによって違うけど、原則としてはブラウザキャッシュがある状態でよくみられるサイトは外部でも問題ない…
使わないよね。フツー。イベントめっちゃとらえるよ。
スクリプトがダウンロードしてるときはほかのコンポーネントはダウンロードできない。スクリプトが書いてあるとそこから下のレンダリングはブロックされる。 ひとつのドメインに対してリクエストは2つまでしか受けれない。 imageサーバのホスト名をもうひと…
プログレッシブ(逐次)・レンダリング 上から順番にロードし、レンダリングされていくことでユーザーにとってはプログレスバー代わりになる スタイルシートを下におくとこのプログレッシブ(逐次)・レンダリングができなくなる スタイルシートによってレンダリ…
gzipもしくはdeflateで圧縮、deflateでの圧縮は今はほとんどない。キホンはgzipでいい。 HTMLのみでなくjs, stylesheetも圧縮すべき。 ただし画像とpdfはやっちゃだめ！なぜならすでに圧縮されてるから。CPUの無駄使いになる。 一般的に1〜2KBだったら圧縮す…
Expiredをつけとくと、if-modifiedでチェックされる。 サーバにリクエストもされない。それはリクエストヘッダがブラウザで止まってレスポンスを返してる状態のことを言う。 だからリクエスト、レスポンス自体は見える。だけどブラウザだけローカルだけで終…
Akamaiとか。image, js, css, flashとかをCDNにまかせる ツール Gomez Keynote
1-1 image mapタグにする 画像を1枚にしてmapタグで書くってことだよね。確かに1msは早くなった。。 1-2 CSS スプライト アイコンがごっそりある画像を一枚用意する。 ネガティブマージンのbackgroud-positionとwidth,heightで指定する。 背景、ナビゲーショ…
条件付GETメソッド If-Modified-Sinceがついたリクエスト、更新されてるかリクエストで問い合わせてる。⇒304で返すかどうか If-None-Match ETagが同じかどうか Expiredがレスポンスで返されると、リクエストにもいかないってか。すげーな。 Keep-aliveでconn…
バックエンドがある程度最適化されたあとのハナシだね。基本的には。 フロントとバックの関係！！ コンパイラオプション、インデックス、メモリ管理がバックエンド⇒20% フロントエンドコンポーネントのすべてのダウンロード⇒80% キャッシュがあるとHTTPリク…
スクリプトが実行してるときはほかのコンポーネントはダウンロードできない HTTP1.1ではひとつのドメインに対してリクエストは2つまでしか受けれない HTMLのレンダリング解析は上から順番に行われる この３つ区別！！大事！ 他のページにいって同じリンクを…
ずいぶん前に買っていたこの本をもう一度読んだのでまとめる ネットワークとwebのキホン HTTPのバージョンはまだ1.1 3wayハンドシェイク IPではMACアドレス HTTPはこうして動く HTTPはステートレス メソッドで命令出す GET リソース取得 POST エンティティボ…
リクエスト時にもcookieを含めるし、 レスポンスでサーバでset-Cookieする。 いずれもHTTP HEADERでやること。いつもながらこちらで拝借。 studyinghttp.net - このウェブサイトは販売用です！ - 解説 仕様書 利用 技術 である 手法 日本語訳 プログラミング…
redirectは一度クライアントに戻してサーバにいく transferはサーバ間でそのまま転送するだけ
セッションはサーバのオブジェクトつまりは Webサーバ(IIS/Apache)のメモリに展開されるもの。 で、そのオブジェクトを持ち続けステートフルな環境を実現するためにsession-idってのが ある。このsession-idを持ちつづけることによってsession("userid")とか…
