1

ついにレスポンシブサイトが（流行の）機能するようになりました。私が今やりたいのは、モバイルデバイスにロードされるスクリプトを減らして、ロードを高速化することです。スクリプトは携帯電話では冗長であるため、開始するのに適した場所のようです。

デバイスに応じて特定のスクリプトのみをロードする方法はありますか？

このサイトはサードパーティのeコマースサイトであり、デバイスごとに異なるバージョンのページを許可していません。サーバー側の言語はprogressのe-scriptです（私は何も知りません）。

どんな助けでも大歓迎です!!

4

4 に答える 4

1

You could always try linking to the other JavaScripts using JavaScript, and include checks for which browser the user is using.

This page has some information about Dynamic Script Loading, which is what I believe you are looking for: http://unixpapa.com/js/dyna.html

于 2012-02-06T22:51:32.967 に答える
1

これらのスクリプトファイルの大きさはどれくらいですか？モバイルデバイスでは、（ページの下部に読み込まれている限り）0.5メガバイト未満のことを心配する必要はありません。

それ以外の場合は、サーバー側のソリューションがおそらく最適に機能します。

PHPを搭載したモバイルデバイスかどうかを確認するにはどうすればよいですか？

于 2012-02-06T22:54:02.353 に答える
1

Modernizrは機能検出を行い、条件付きでリソースをロードできます。あなたがあなた自身を展開しない限り、それは多かれ少なかれこの種のものの標準です。

于 2012-02-06T23:07:56.097 に答える
0

次のような 3 列のデスクトップ レイアウトがあるとします。

<body>
  <div id="ad-1">
  //javascript1 goes here
  </div>
  <div id="content">
  //content goes here
  </div>
  <div id="ad-2">
  //javscript2 goes here
  </div>
</body>

また、次のようなレスポンシブ サイトを作成したとします。

@media screen and (max-width: 1024px) {
  #ad-1{ display: none; }
}
@media screen and (max-width: 768px) {
  #ad-2{ display: none; }
}

スクリプトが表示されていない場合はロードしたくないので、これを解決する方法を次に示します。

var ResponsiveScriptsLoader = {

onAdsReady: function() {
  console.log('success');
},

addScripts: function(scripts, callback) {
  for (var i = 0; i < scripts.ads.length; i++) {
    this.include(scripts.ads[i].src, scripts.ads[i].selectorID);
    if(i==scripts.ads.length-1) callback();
  }
},

include: function(what, where) {
    var deferred = new $.Deferred(), place;
    var e = document.createElement('script');
    e.onload = function () { deferred.resolve(); };
    e.src = what;
    place = document.getElementById(where);
    if(place) {
        place.appendChild(e);
    }
    return deferred.promise();
},

init: function(){
if(screen.width > 768){ 
    if(screen.width > 1024){
        this.addScripts({
        ads: [
        {
            src: "http://ads.script1.js",
            selectorID: "ad-1"
        }, 
        {
            src: "http://ads.script2.js",
            selectorID: "ad-2"
        }
        ]}, this.onAdsReady);
    } else{ // Screen size is between 769 and 1023
        this.addScripts({
        ads: [
        {
            src: "http://ads.script2.js",
            selectorID: "ad-2"
        }
        ]}, this.onAdsReady);
      }
    }
}
}   

ResponsiveScriptsLoader.init();
于 2014-01-23T20:33:49.893 に答える