x3.js JavaScript rapidly reloader release

x3.js というものを創ってみました。 http://code.google.com/p/x3-js/

JavaScript をキャッシュしておき、JavaScript ロード時に発生するボトルネック/ブロッキングやネットワークアクセスコストをゼロにしようという、ありそうでなかったライブラリです。

WebSQL が使える環境なら WebSQL を、だめなら WebStorage にキャッシュします。

• x3.js のターゲットは iPhone, Android です
  • PC ブラウザでも動作します。IE6 と IE7 対応は特別料金となっております
• 5MB までのファイルをキャッシュ可能です
• ページの読み込みが落ち着いてから、サーバにアクセスしキャッシュを更新する機能があります
• x3.js は Minified で 2.2kbyte。ページに直接埋め込んで使います
• js の一本化を強制します
  • 一本化は意図してデザインした仕様です。強制的に型にはめるのでフレームワークともいいますか
  • 一本化することで…
    • 読み込み順に起因する依存関係が存在しなくなります
    • ファイルの圧縮効率が最大化します
    • 同一ドメイン内では常にキャッシュされた状態になります。ものすごく効率がいいです
    • 「JavaScript の読み込みが遅いから～」という苦情が一切なくなります。そのような苦情が来たら「ちがうんじゃない?」と返す刀でバッサリ切り捨てられます
• 一本化した js は HTML と同じ場所に置く必要があります
  • 内部で XHRを使いサーバ上のファイルの更新をチェックしているため、XHR Lv2 に対応していないブラウザを考えるとスクリプトを別のドメインで配布することはできなくなります
    • CDN に js を設置するという発想は一旦捨ててください
• 一本化したことにより、あるページでは必要のないスクリプトも全て走ってしまうのでは? という心配があると思います
  • x3.ready という URL ディスパッチャ機能を提供しています。そのページに必要なコードを走らせる事ができます
  • JavaScript の初期化が遅くなるのでは? という心配があると思います
    • 初期化が遅いのは恐らく JavaScript のコードや重厚なライブラリ側の問題であり、ブラウザ側の問題ではなかったりします
    • 一本化したことにより JavaScript の初期化に 300ms 程度の余計な時間がかかったとしても、JavaScript がもたらすネットワークアクセスのボトルネックは、ページ全体で 1000ms 単位のオーダーだったりしませんか? そこだけではなく、全体を見るといいと思います
• キャッシュ後はページロード中のコネクション数が一本減ります。ネットワークアクセス周りが確実に改善します
• script defer や script async と結果よく似たコンセプトになりました
  • defer や async と比べると「今すぐ使える」「キャッシュされる」「コネクション数をさらに1本減らせる」「更新チェックを後回しにできる」というメリットがあります
    • これらメリットが特に不要なら x3.js を使わず、従来の方法で良いと思います
• x3.js は とてもシンプルな構造です
  • Hack 満載なスクリプトローダーや、<script src="..."></body> といった IE6, IE7 で危険な Hack を過去のものにします
• x3.js は WebSQL や WebStorage への基本的なアクセスも提供しています
  • 同じ土台を使って CSSスプライト用の画像をキャッシュしておくプラグインなども作れると思います
• ブラウザゲーム(ソーシャルゲーム等)では、Range ヘッダーなどをこちらの予想とは違う形で解釈するような(または叩き落とす)独特なProxyを経由する事が多々あります
  • そのようなアウトオブコントロールな環境においても、x3.js を使う事でリクエストをコントロールできる可能性が増えます
  • HTML5を使ったブラウザゲームなどはゲーム内イベントが頻繁に発生し、そのつどアップデートが必要になります
    • そのような環境においても x3.js を使う事でキャッシュの最大化とページアクセス時のボトルネックの最小化を両立する事が可能になります

といった感じです。

(ε・◇・)з えーとね…

(ε・ᴥ・)з『よくある「ロードを速くする10の方法」「ハイパフォーマンス○○」とか
(ε・ᴥ・)з 1～2年前に海外で流行った古くて中途半端な情報にちがいないよ!
(ε・ᴥ・)з まゆつば! まゆつば! ハナシ・ハンブン ってやつだよきっと!』

(ε・◇・)з って言われそうなので、わりと念入りに準備しておりました

(ε・◇・)з WebSQL は凍結された規格だけど、
(ε・◇・)з SQLite が搭載されている iPhone, Android では、この先もずっと使えそうな事がわかってるし、
(ε・◇・)з おかげで WebStorage とは別の領域に 5MB もの大容量の可処分領域が確保できるってメリットもあるよね
(ε・◇・)з Chrome for Android βでも WebSQL は使えるよ (Android Browser にあったバグも修正されてたし)

デプロイする段階で、JavaScript ファイルの結合と Minify(コンパイル)という作業が発生しますが、コードの文法チェックやエラーもある程度機械的に検出できるという嬉しい副作用もありますし、コードの結合はあまり大変な作業でもないはずです。
そのへんはサクッと乗り越えて、ぜひ試してみてください。

(ε・◇・)з バグや「こーするといいよー」などがありましたら @uupaa まで～
(ε・◇・)з (コメント欄はスルーなのです

x3 ってなんてよむの?

• (ε・◇・)з とりぷるえっくす
• (ε・◇・)з えっくす さん
• (ε・◇・)っ エクスリー
• (ε・◇・)з くわとろさん。お寿司おごってください

(ε・◇・)з のどれかだとおもいますー