top


総投稿数 本 
no_

スポンサーサイト

 --------
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
カテゴリ :スポンサー広告 トラックバック(-) コメント(-)
no_961

Page Speed:これは耳寄りなお話。Googleが社内で利用していたWeb最適化ツールを、オープンソースとして放出したそうな・・・ 【Google】

 2009-06-06
Adobeが続いたからね。今度は、Google
とても耳寄りなお話を聞いた。

Googleが社内で使っていたWebサイト高速化ツールを一般公開
 ( by TechCrunch )
Googleが社内で使っていたWebサイト高速化ツールを一般公開※引用転載
 ・Googleはサイトを効率化するために、
  ・Page Speedというツールを
   社内で使っていたが、
 ・同社はこのツールを一般公開



 ・・・もちろん、早速アクセス。
 早速利用して、詳細な記録を残してます。
 ※ちなみに、このツールで最適化する前の
  ・読み込み時間は、32.858秒
 読み込み時間は、32.858秒
   (とんでもなく遅いですが、複数のサイトから
    いろいろと組み込んでいるブログの特性でもありますね)
   さて、これがどこまで速くできるのだろうか・・・

  追記に(ちょっと、長文ですがご容赦) ▼


 ※ところで、こちらは・・・


◇今日のGoogle:6月6日
今日のGoogle(2009/06/06)

 ※さらに、こちらは・・・


◇今日の見つかりません
今日の見つかりません

FC2ブログランキング にほんブログ村 IT技術ブログ Webサイト構築へ ブログ王ランキング 人気ブログランキング 人気ホームページランキングへ


moreさてさて・・・
どうだろ。

Google Code Blog: Introducing Page Speed
Google Code Blog: Introducing Page Speed こちら、
 GoogleCode の該当頁。
 ※ちなみに、
  ここには、Googleオリジナルの
  翻訳がジェットがあり、これで
  日本語にするといいよ。




 上記紹介記事に詳しくあるけれど、
 ツールはあらためてオープンソース化され、
 ・Firebugに組み込まれたFirefoxプラグイン
  として動く。
 ・サイトをスピードアップするための
  ベストプラクティスを提案
  (例えば)
   ・画像を自動的に圧縮して
    Webサイト上ですぐに使えるように
   ・ページの表示に使われていない
    JavaScriptやCSSを見つけるので、
    それらを削除すれば
    ページのロード時間を短縮できる。

 ※同じく最適化ツールとして
   知られている、
   ・Firefoxプラグイン
    ・YSlow
    (こちらは、Yahoo提供)
  などと同じ種類のツールですね。


 ■まず、ダウンロード
  ※ちゃんと、Firefox のブラウザでアクセス。


 ■(お決まりですが)この「創るmetaboy」で試そ
  □頁を表示させて、Firebug を起動させる。
   頁を表示させて、Firebug を起動
   ・確かに、Firebugに組み込まれている。


  □Page Speed を起動。
   Page Speed を起動
   働いているって感じ・・・
   ※働いているって感じ・・・


  □とても、「オブジェクト的(?)」で
   使い易そうだなぁ。
   使い易そう


   ・驚きマーク(!)は、特にチェック必要なようだ。
    ・Leverage browser caching
   Leverage browser caching
     ※キャッシングを最適化しろ、と。
      > 解説頁はこちらだが、
        Yahoo検索の力も借りて読み解くと
      ・「最低1ヶ月のキャッシュの設定をヘッダでする」こと
       を、奨めると。
       これは結構微妙な課題だな。通常制作する際に、確実な「更新」
      を実行させるために、「キャッシュを無効にする」処理は
      よくやるけれども(参考 > ブラウザ のキャッシュを制御する/no-cache
      あえて「キャッシュ設定させる」ことは行わない。加えて、この
      「Page Speed」が指摘しているファイル群の多くは、リンクしている
      他のサイトのものだ。
      [結論]
      ・このブログでは対応はしないけれども、今後他のプロジェクト
       では、考慮の価値があると判断。その際に利用させていただく。


    ・Combine external JavaScript
   Combine external JavaScript
     ※外部のJavaScriptを結合しなさい、と。
      > 解説頁はこちら
      ・「ファイルへの往復を防ぐためにひとつのファイルにしろ」と
       いうことですね。
       確かにこれは、有効的でありかつ、できることのひとつだ。
       しかし、prototype-min.js や jquery1_3_min.js 他
      多くのライブラリを、各々組み込んでいることを考えると、
      その管理は大変そうではある。


       しかし!やろ。やってみる価値はあるからだ。
       (まずはこの「創るmetaboy」内で組み込まれている
        jsファイルに対応してみる)


      ・・・で、
       これは、解説の頁にも語られていることだが、
       ・ひとつのベース組込み用の jsファイルを用意し
       ・他は2つのJsファイル(更新日時によるファイル)
        ・外部ライブラリの結合js
        ・自作テストなどの結合js
        として
        出来る限り結合してみよう。
   Combine external JavaScript
        ターゲットは、この12のjsファイルだ。


        まずベースとして、オリジナルで作成している
        ・metaboy_function20090509.js
        ・metaboy_common.js
        ・cookie.js ※これは Page Speedにないけど。
        これをひとつにして、ベースjsとする。
        (metaboy_base20090606.js)


        次に、自作関連として
        ・test_graph.js
        これを、ベースjsとして今後に備える。
        (metaboy_making20090606.js)
        ※でもこれは一部の原稿のときに必要なものなので
         いづれ対応しなければならない。


        最後に、様々なライブラリをひとつの結合ファイルに
        まとめる。
        ・prototype-min.js
        ・effects_aculo_us.js
        ・swfobject.js
        ・jquery1_3_min.js
        ・thickbox.js
        ・metaboy/marquee_miya2000.js


        ※ただし、下記のファイルは、このFC2ブログの仕組み上
         まとめられない。
        ・whatsnew_archives20090525_1.js
        ・metaboy_tsukuru_linktree20090530_1.js
        ・whatsnew_archives20090525_1.js
        ・blogparts_ashiato20090525_1.js


       >>作業実行


       ※ここで、面倒くさいけれども、この効果を
        確かめるため、最初のテスト時
         ・読み込み時間は、32.858秒
 読み込み時間は、32.858秒
        と同じ状態
        ・PC立ち上げて、Firefoxのみ起動
        ・創るmetaboy を単独で開く
        にするため、一度PC再起動
        で、テスト
         ・読み込み時間は、29.174秒
 読み込み時間は、29.174秒
        おぉ、わずかだが効果あったのか(?)
   Combine external JavaScript
        解析後のjsファイルも、最低ベースになっている。
        これからは、心がけるようにしたい。


    ・Minimize DNS lookups
   Minimize DNS lookups
     ※DNS検索を最小に、と。
      > 解説頁はこちら
      ・「あまり多くの異なるサイトのリンクを組み込むな」と
       いうことですね。
       非常によく理解できるけれども、これは致し方ない。
       オリジナルのサイトを構築する際は、気をつけることにしたい。


    ・Optimize images
   Optimize images
     ※画像の最適化。
      > 解説頁はこちら
      ・ここで提示されるリスティングは素晴らしい。
       具体的に、
       ひとつひとつのファイルをどうしろと。
       要はこれらを行えばいいわけだ。
   

Resizing http://www.metaboy.net/images/common/stars_4_5.gif could save ~214 bytes (53.1% reduction). The image is scaled in HTML from 64x12 to 45x8.

       他のサイトのリンク画像や
       活用させていただいている、
       ・サムネイル表示のAPI
        MozSHot に関してはいたしかたないけれども・・・
       なんとか時間を見つけてトライしたい。


    ・Serve resources from a consistent URL
   Serve resources from a consistent URL
     ※要は同じ内容の重複ですね。
      > 解説頁がリンク切れ。今日の「見つかりません」だ。


  とりあえず、駆け足で
  ・驚きマークを検証してみたが
  これはかなり、使いでのあるツール といえる。


 素晴らしい。今後、仕事にも十分
 役立ってくれそうだ。

commentsコメント
comment_post












管理者にだけ表示を許可する
commentトラックバック
トラックバックURL:
http://metaboy.blog23.fc2.com/tb.php/961-62740b68
ようこそ
Add to Google 創るmetaboy:RSSフィード
My Yahoo!に追加
最新記事のRSS | 問い合わせ

仕事検索、アルバイト検索、依頼仕事の検索ポータル - 仕事検索.COM - www.jobkensaku.com ツクルン

創るmetaboy - WEB創る、サイト創る、何創る - 創ったmetaboy

 

リンク集

 

最近の記事

 

ブロとも申請フォーム
Sponserd by

さくらのレンタルサーバ さくらのレンタルサーバ
大容量・高機能レンタルサーバー heteml 大容量・高機能レンタルサーバー heteml
XREA (ValueDomain)
お名前.com お名前.com
名づけてねっと名づけてねっと
ムームードメインムームードメイン

 

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。