3

現在、学生プロジェクトに取り組んでおり、コードで問題が発生しました。私たちは、夜間に働く人々に関するビデオ、画像、音声、およびテキスト データを組み合わせた電子ドキュメントを作成しました。これは、DB にアクセスするための HTML、Javascript、および少しの PHP で構成されています。

最近、ウェブサイトにアクセスしたときにページが無限に読み込まれ続けることがわかりました...JSコードの一部が壊れており、破損している可能性のあるリソースを特定する方法がわかりません...

ページを「永久に」ロードできるのは何ですか? また、問題を特定するにはどのようなツール (つまり、firebugg または組み込みの chrome など) を使用する必要がありますか?

ここで開発バージョンを見つけることができます: http://mgprddev2012.dream-valenciennes.com

EDIT : PHP エラーは OK になりました。最新バージョンのコードを開発プラットフォームにアップロードするのを忘れていました。

どうもありがとう

4

3 に答える 3

4

あなたは頭がおかしいわけではありません。このページの読み込みには非常に長い時間がかかります。

Chrome デベロッパー ツールの [Network] タブを見ると、最初に大量の画像、音声ファイル、および動画ファイルが読み込まれ、それらのほとんどがすぐには表示されないことがわかります。そしてそれらのいくつかは非常に大きいです。これはおそらく、表示が必要になるまで、または少なくとも必要なアセットをすぐにロードするまで、これらのアセットのほとんどのロードを延期するのが最善の状況の 1 つです。

YSlowを確認することをお勧めします。これは、Web ページの読み込みを高速化し、読み込みが高速に見えるようにするためのヒントを提供する監査ツールです。このサイトには、さまざまな戦略が効果的である理由について、いくつかの良いヒントと完全な説明もあります.

この特定のページに関するいくつかのヒント:

  • あなたの画像の多くはテキストの写真です。これらを実際の html テキストとしてレンダリングすることを検討してください。CSS を使用して各文字のサイズを変更することもできます。さらに、フランス語を話さないユーザー向けに Chrome でテキストを翻訳できるという利点もあります。CSS ボーダーを使用してテキストの周りに線を引くか、SVG を試すことができるはずです。

  • 背景画像は 2.2 MB です。それはかなり大きいです。より低い圧縮設定で保存してみてください。

  • 個々の png ファイルにたくさんのアイコンがあります。それらをすべて 1 つのファイルにまとめて、 CSS スプライトとして表示することを検討してください。

  • 透明度を除いて、jpg のように見える png ファイルがいくつかあります。意欲的な方は、左側にカラー チャンネルを、右側にアルファ チャンネルをグレースケールとしてレンダリングした jpg を作成し、キャンバスを使用してそれらを合成できます。

  • また、アニメーション用のスプライトを含む png ファイルもいくつかあります。それらをビデオに変換して、上記と同じキャンバス トリックを試すことができます。WebGL を使用する場合は、使用できるコードがいくつかあります。

于 2013-01-31T03:43:51.863 に答える
3

私にとっては問題なく読み込みが停止します。Firebug は通常、何かがバックグラウンドでロードされているかどうかを通知します。コンソール領域を見て、ページの読み込み時に停止しているものがないかどうかを確認します。私にとっては問題なく終了したので、現在の状態でハングしていると言っていますか。

コンソールには、正常に動作しない原因となる可能性のある JavaScript エラーも表示されます。

于 2013-01-17T20:28:41.573 に答える
0

JavaScript コンソールで:

Uncaught TypeError: Cannot call method 'pause' of undefined debout.js:979

debout.pop02宣言していないとのことです。どこで初期化しますか?

于 2013-01-17T20:29:47.373 に答える