web-dev-qa-db-ja.com

ページの読み込みを速くする方法は？

可能性のある複製：
ウェブサイトの読み込み速度を改善するためのアイデア？

私のページはyslowでパフォーマンススコア79を取得します。これは悪くありません。 Yslowは、私が取り組むことができる部品は

1）

グレードFでHTTPリクエストを減らす

多くのHTTPリクエストを行いますが、どうすればもっと少なくできますか？このページはfacebookとgmaps APIを使用しており、これらの機能の使用をやめることは一種の問題です。

2）

コンテンツ配信ネットワーク（CDN）の使用に関するグレードF

できると思いますが、別のホスティングプロバイダーが必要なようです。

3）

Add ExpiresヘッダーのグレードF

app.yamlのexpiresヘッダーを自分のものに追加しようとしましたが、expiresヘッダーがない他のソースのコンポーネントのようです。

4）

JavaScriptを下部に配置するグレードF

繰り返しになりますが、推奨事項なので、JavaScriptを先頭に配置する必要があります。ここで何か特別なことをすべきですか？

5）

HTMLで画像をスケーリングしないでグレードB

インラインスタイル要素とは別の方法でできると思います。

6）

CSS式の回避に関するグレードB

これが何なのかわかりません。

だから私はそれをさらに良くしたいです。このコードを最適化する方法はありますか？

{% spaceless %}{% load i18n %}<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
  <head><meta http-equiv="Cache-Control" content="no-cache" /> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{% trans "Jobs" %}, {% trans "Houses" %}, {% trans "Services" %}, {% trans "Cars" %}, {% trans "Commercial properties" %},</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="date" content="{% now "l, F jS Y" %}" />
<meta name="description" content="{% trans "VEHICLES" %},{% trans "Motorcycles" %},{% trans "Apartments" %},{% trans "Houses" %},{% trans "Cars" %},{% trans "Jobs" %},{% trans "Other vehicles" %},
{% trans "PROPERTIES" %},{% trans "Houses" %},{% trans "Commercial properties" %},{% trans "Land" %},{% trans "ELECTRONICS" %},
{% trans "TV/Audio/Video/Cameras" %},{% trans "Computers" %},{% trans "Home &amp; Garden" %},{% trans "Clothes/Watches/Accessories" %},
{% trans "For Children" %},{% trans "LEISURE/SPORTS/HOBBIES" %},{% trans "Hobby &amp; Collectables" %},{% trans "Music/Movies/Books"%},
{% trans "Pets" %},{% trans "BUSINESS TO BUSINESS" %},{% trans "Professional/Office equipment" %},{% trans "Business For sale" %},{% trans "Services" %}" />
<meta name="Keywords" content="{% trans "VEHICLES" %},{% trans "Motorcycles" %},{% trans "Apartments" %},{% trans "Houses" %},{% trans "Cars" %},{% trans "Jobs" %},{% trans "Other vehicles" %},
{% trans "PROPERTIES" %},{% trans "Houses" %},{% trans "Commercial properties" %},{% trans "Land" %},{% trans "ELECTRONICS" %},
{% trans "TV/Audio/Video/Cameras" %},{% trans "Computers" %},{% trans "Home &amp; Garden" %},{% trans "Clothes/Watches/Accessories" %},
{% trans "For Children" %},{% trans "LEISURE/SPORTS/HOBBIES" %},{% trans "Hobby &amp; Collectables" %},{% trans "Music/Movies/Books"%},
{% trans "Pets" %},{% trans "BUSINESS TO BUSINESS" %},{% trans "Professional/Office equipment" %},{% trans "Business For sale" %},{% trans "Services" %}" />   
<link rel="stylesheet" href="/static/css/style.css" />
</head>
<body onload="initialize()"><div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '164355773607006', // App ID
      channelURL : '//WWW.KOOLBUSINESS.COM/static/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      oauth      : true, // enable OAuth 2.0
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>
<div class="container_12">
    <div id="mainCol" class="grid_12">
        <div id="header">
        <div id="navbar"> 
<ul><li><a href="ai">{% trans "Add" %}</a></li>
    <li><a href="li">{% now "d M" %}</a></li>                   
{% if user %}<li><a href="{{ logout_url }}" class="logout">Logout Google</a></li>{% endif %}    
{% if current_user %}<li><a href="https://www.facebook.com/logout.php?next=http://{{Host}}&access_token={{current_user.access_token}}">Logout Facebook</a><li> {% endif %}
{% if not current_user and not user %}<li><a href="/login">{% trans "Log in" %}</a></li>{% endif %}
</ul>
</div>
        {% if user or current_user %}
            <div id="user-ident">
                <span>{% trans "Welcome," %} <b>{{ current_user.name }}{% if not current_user %}{{ user.nickname }}{% endif %}</span>
            </div>
            {% endif %}
            <div id="logo-wrap">
                <div id="logo-img"><a class="nobk" href="/ai"><img src="/_/img/kool_business.png" width="140" height="166" alt="Market Logo"/></a>
</script><g:plusone></g:plusone>
<div class="fb-like" data-href="{{Host}}" data-send="true" data-width="450" data-show-faces="true"></div></div>
                <div id="logo-text"><h1 style="display:none">Market</h1>
</div>
            </div>
        </div>
    </div>
</div>
<div class="clear"></div>
<div>       
    <div class="mapContainer"><center>
        <div id="gmap">&nbsp;</div></center>
    </div>
<div class="container_12">
    <div class="grid_6">
        <div class="title1">{% trans "Post a photo" %}</div>
        <div class="countries_list">            
            <form method="post" action="{{form_url}}" enctype="multipart/form-data"> <div>
            <input type="file" name="file" /><input type="submit" value="{% trans "Go" %}" /></div> </form>         
        </div>
    </div>
    <div class="grid_6">
        <div class="title1">{% trans "Information" %}</div><div> {% trans "You can post ads for free. You can search for classified advertisements from professionals as well as private individuals; such as: cars, property, employment, pieces of furniture, electronics and others." %}</div>
        <div class="link_to_profile">   </div>              
    </div>
</div>
<div class="clear"></div>
<div class="container_12">
    <div class="grid_12">
        <div id="footer">
        &copy;2011 <a href="http://koolbusiness.com" title="kool business">koolbusiness.com</a> 
        </div><iframe src="https://www.facebook.com/plugins/registration.php?
             client_id=164355773607006&
             redirect_uri=http://www.koolbusiness.com/
             fields=name,birthday,gender,location,email"
        scrolling="auto"
        frameborder="no"
        style="border:none"
        allowTransparency="true"
        width="100%"
        height="330">
</iframe>
    </div>
</div>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&libraries=adsense"></script>
<script type="text/javascript" src="static/js/home.js"></script>
</body>
</html>{% endspaceless %}
javascriptpythonhtmlgoogle-app-engine
1
Niklas Rosencrantz

1）ファイル上のすべてのCSSおよび1つのファイル内のJavaScriptファイルをマージして、HTTP要求を減らします。すべての背景を1つの画像ファイルにマージし、CSSを使用してそれらを分割します

2）ホストを変更するか、cloadfare.comを使用します

3）スクリプト開発者に連絡して修正してください

4）simple：JavaScriptを下部に置く：before

5）またシンプル：HTMLで画像を拡大縮小しないでください。 Web用のフォトエディターで画像のサイズを変更する

6）scc（javascript）ファイルを圧縮します。

およびアイデア：キャッシングを使用します。サーバーとクライアントの両方のローカルメモリ（html5機能）

3
Towhid