2012-11-24 15 views
5

私は別々の.jsファイルにjavascript関数を書いています。私の最後のプロジェクトでは、javascriptファイルの数が増えていたため、リクエスト数が増えたため、ページの読み込みが遅くなりました。だから実験的な目的のために、私は.php拡張子を持ついくつかの.jsファイルを変換し、includeステートメントでそれらを追加しました。このようにして、ローディング時間のパフォーマンスが向上しました。 .phpファイルにjavascriptを書くことには多くの利点があります。私はPHPの変数にアクセスし、簡単にそれらをJavaScriptに渡すことができます。拡張子.phpのjavascriptファイルを作成する

私の疑問はここにあります.JavaScriptを.phpファイルに書き込んだ後にそれらを含めた場合の不利な点はありますか?

私が理解しているのは、ページが読み込まれると、javascriptファイルを呼び出して、パラレルにPHPの部分を実行するということです。そこで、onload関数を記述します。

答えて

3

ほとんどのブラウザでは、2つ以上の同時接続を使用してリソースをロードできます。したがって、javascriptを別々のファイルに保存すると、ブラウザがすべての接続を完全に利用できるようになります。可能であれば、<script>タグをHTMLの後半に含めて、JSのロードが開始される前にページの内容が書き込まれるようにする必要があります。

PHPを使用する利点の1つは、JSファイルのサイズを縮小するためにgzipすることです。

JavaScriptファイルのサイズが小さい場合、たとえば< 100 KBとすると、1つのPHPスクリプトに複数のファイルを含めるほうがはるかに速くなる可能性があります。しかし、javascriptファイルが500 KBのように大きい場合、それらを別々に保つほうが速くなる可能性があります。

あなたの答えを見つけるのに役立ちます。ここに普遍的な真実はありません。

+0

キーをロードしますここで実験することです。パラレル・ダウンロードのメリットは、ファイルを1つのファイルとして扱うことと、ファイルのサイズに依存することです。 – Brad

+0

あなたの意見に同意してください。これには具体的な解決策はありません。 gzipは良いアプローチです。私は、同時接続を提供するブラウザについて知らなかった。ありがとう。 +1 –

7

あなたがPHPを使用してサーバー側で一つに複数のJavaScriptファイルをコンパイルしたい場合は、あなたがこのような何かを行うことができます。

<?php 
// script.js 
header('Content-Type: text/javascript'); // Tell browser to treat file as Javascript 

$files = array(
    'script-1.js', 
    'script-2.js', 
    'script-3.js' 
); 

foreach($files as $file){ 
    // Import each file 
    echo file_get_contents($file).PHP_EOL; 
} 

次に、あなたのページでは、ちょうどそれかのようにそのファイルを参照しますJavascriptのファイルだった:PHPからロードのjsファイルの

... 
<script src="script.php"></script> 
... 
+0

ありがとう@Adam。それは、ファイルを結合して使用する良い方法です。 +1 –

1

問題は、あなたがあるため、あなたのページがブラウザ上でゆっくりとレンダリングすることのあなたの応答のサイズを大きくしていますさ。反対側では、jsファイルを読み込んでいるブラウザであれば、ブラウザはjsファイルのために別の要求を送るので、最初のページの読み込みが遅くならないようにするには、jsをPHPに入れないでください。

あなたのjsファイルの読み込みを高速化したい場合は、以下のもの

  1. 縮小化を行うあなたのすべてjavascriptCompressorまたはjsmini
  2. のようなツールを使用してファイルがCDNのサポートを持っている他のサーバ上でこれらの縮小さのファイルを置きJS cdnからの読み込みは常に高速で、ブラウザは一度に複数のファイルをダウンロードできます。

  3. jqueryやGoogleのcdn urlからの他のライブラリのようなロードファイル、または各サイトには、それがロードされないように、長い時間のためにあなたのjsファイルを維持するためにブラウザをさせるための 使用期限ヘッダーには、非常に

を要求し、あなたがこれらの技術に従うならば、あなたのページが速く

関連する問題