この日記はMozillaのプロダクトへの貢献者としての私の成果を中心に、気になったバグやWeb界隈の話題について書いていますが、 断り書きがある場合を除き、いかなる団体のオフィシャルな見解ではありません。あくまでも個人的なものです。 Mozilla Foundation、Mozilla Corporation、及び関連企業の公式情報ではないことに注意してください。

現在、XHTML 1.0 (もどき)から、HTML5なコンテンツに修正中です。古い日記は修正が完了していませんので表示が崩れます。 順次、修正していく予定ですのでしばらくお待ちください。

もずはっく日記(2012年2月)

2012年2月28日

Bug-org 730760 laying out and rendering shouldn't halt by <script> accessing another server for src attribute
初回投稿日時: 2012年02月28日12時44分26秒
最終更新日時: 2012年02月28日15時37分26秒
カテゴリ: Javascript Mozilla Core バグ原因判明 バグ報告
SNS: (list)

一部のページにアクセスした時に、別のサーバへの接続を開始すると、レイアウトやレンダリングが一時的に中断する、というバグです。前々からFlashの挙動を確認するのに使っていたページで発生していたのですが、一向に修正される気配がないので、どういうことか調べてもらうために報告しました。

原因は、<body>の先頭付近にある、<script>で、応答な無いサーバにあるスクリプトを読み込もうとしていることにありました。

WebKitでも現状では同様のようですが、その理由として、もし、そのスクリプトファイルの読み込み中に変数の宣言や初期化があり、次以降の<script>内でそれらを参照すると動作が壊れる、document.write("<!--");のようなことをされると、それ以降の意味が大きく変わってしまう、という問題があるため、そこで一度止めるしか今のところアイデアが無いそうです。

Webアプリの開発者の方は、こういったことにならないように<script>要素での読み込みを非同期にすることで解決できます。非同期にするには、<script>要素に、async属性か、defer属性を記述してください。ただし、以下のようなことを行っている場合には、バグってしまいますので、そのようなスクリプトを非同期で読み込んではいけません。

  • scriptファイルの読み込み中にグローバルな変数を初期化し、それをそのscriptファイル以外の場所から参照している
  • document.write("foo");をスクリプトが読み込まれた時に実行している

是非、Webページを作る方は、できる限り非同期で読み込むようにし、また、自身で設計する場合には、非同期読み込みにできなくなるような設計にならないように注意しておいてください。

関連するかもしれないエントリ

bug-org 730760を含むエントリ

このエントリへのリンク元