1

このコードは、RSS フィードからの応答を処理します。コンテンツを整理して追加します。ビデオが埋め込まれている場合は、残りのコンテンツから分離します。主にパフォーマンス/効率に関するレビューを希望しますが、他の提案も受け付けています。そのスターセレクターは本当に私を悩ませていますが、含まれているすべての要素を反復処理するより良い方法を知りません.

function getFeed(url, element, callback) {
    $.getJSON("https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q="+encodeURIComponent(url), function(response) {
        var content = "",
            $element = $(element);

        for (var i = 0; i < response.responseData.feed.entries.length; i++) {
            content = content + response.responseData.feed.entries[i].content; //Join all the feed entries
        }

        $element.find(".content").html(content).addClass($element.find("embed").length? "withVideo" : "");

        $element.find("*").each(function() {
            var $this = $(this);

            $this.removeAttr("style width align"); //Reset all the crap that comes with the response

            if ($this.is("embed")) {
                $element.append("<div class='video'></div>");
                $this.attr("width", 640).attr("height", 360).parent().appendTo(element + " .video");
            };
        });

        if (typeof callback === 'function') {
            callback();
        };
    });
}

これは次のように呼び出されます。

getFeed("http://www.kent.k12.wa.us/site/RSS.aspx?PageID=3854", "#TechExpo", optionalCallback);

応答は次のようになります

<div width="500" style="whatever"><p>Some text blah blah blah.</p>
<p align="right">Some more text</p>
</div>
<div><h2>Video Title</h2>
<embed src="http://..." width="360" height="202" type="application/x-shockwave-flash"></embed>
<small>Watch the 7th annual Tech Expo highlights.</small></div>
4

1 に答える 1

1

最初: for ステートメント内で ".length" を使用しないでください。そうすれば、ループ内のすべてのパス中にアイテムの数がカウントされます。

var responseCount = response.responseData.feed.entries.length;
for (var i = 0; i < responseCount, i++) {
...
}

第二に、これが非常に良いアイデアであるかどうかはわかりません (少なくともパフォーマンスに関しては):

$element.find("*")

あなたは間違いなくこれを最適化することができます!

パフォーマンス/効率は、通常、単一の機能を超えるだけではありません。適切に使用しないと、jQuery はパフォーマンスに大きな影響を与える可能性があります。プロジェクトの範囲に応じて、次のことを試すことができます。

  • バージョン jQuery 2.* を検討してください。これははるかに小さく高速です (ただし、後方互換性はありません)。
  • jQuery のカスタム ビルドの使用を検討してください。
  • アプリケーションのスコープ内のブラウザは querySelector をサポートしていますか? もしそうなら、おそらくjQueryさえ必要ないでしょう...
  • コード スクリプトを遅延読み込みして、ページの読み込み時間を短縮することを検討してください

この Web サイトには、さらに読むための非常に優れたチェックリストが含まれています: http://browserdiet.com/#js

于 2013-07-23T20:58:16.343 に答える