NO TEST, NO LIFE. NO DOC, NO LIFE - latest log
uupaa.js や mofmof.js には {@hoge 〜 }@hoge のようなコードブロックを切り落として Minify する機能があるので、「ソースコードにテストもドキュメントも全部埋め込むことが可能だな〜」って3年程前から考えてました。 そこで、Function.prototype.spec というメソッドを追加し、これにスペックを書き貯めたらどうだろうか(?)とか考えました。 たとえば Array.range(1,7) で [1..7] 的な連続した数値の配列を生成する Array.range 関数があったとすると // Array.range - range generator function Array_range(begin, // @param Number: begin end, // @param Number: end filter) { // @param
コードを削る - latest log
Twitter だとちょっと厳しいので、こっちでまとめ。 MobileWebKit に対応しようと思ったら、コードをなんとかして削る必要があります。 AND 演算子 で 4byte 削る(10byte → 6byte) if (a) { b(); } ↓ a && b(); OR 演算子 で 5byte 削る(11byte → 6byte) if (!a) { b(); } ↓ a || b(); ドット演算子以降を自力で Minify する JavaScriptは動的な言語なので、ドット演算子以降は基本的に minify しても圧縮されません。 document.createElement("div"); document.createElement("a"); document.createElement("p"); ↓ このままだと、minify しても縮まらない document.
MessagePack + WebWorkers - latest log
追記 @os0X さんと @edvakf さんからアドバイスをいただいたので、本文とコードを修正しました。 postMessageが文字列に限定されているのは旧仕様で、Firefoxや最近のWebKit(Chrome5とか)はオブジェクトをやり取りできると思います via @os0X http://twitter.com/edvakf/statuses/15644433920 自分でも試してみました。 http://javascript.g.hatena.ne.jp/edvakf/20100607/1275931930 via @edvakf http://twitter.com/os0x/statuses/15621293442 本文 昨日の日記の続きです。 IE9 と Opera で動くようになり、ちょっと速くなり、WebWorkers でデコードするモードを追加しました。 http:
JavaScriptとプリプロセッサ - latest log
uupaa.js にはビルドツール(minify/upa.php)が同梱されています。 upa.php は C/C++ のように #include src.js を自動的に展開します。 クライアントサイド JavaScriptでは include は予約語ではありませんが、(他のライブラリと衝突する可能性があるので)通常はコメントアウトした状態で使います。 // === uu.msgpack / window.msgpack === //#include uupaa.js ← こことか //#include misc/utf8.js ← ここ // MessagePack -> http://msgpack.sourceforge.net/ (this.uu || this).msgpack || (function(namespace) { : : ドット演算子を含む定数をリテラル値に置
uupaa.js 基礎知識なんちゃってマスター - latest log
uupaa.js 0.7 の概要を、1分でざざーっと分かるように書きました。 これ自体10分で書いてるので、ノープラン・ノーチェックでお届けします。 uupaa.js のビルド uupaa.js というファイルはありません。 必要な機能を組み合わせ、ユーザがビルドして作ります。 ビルドコマンド ビルド方法を説明したスライド: http://handsout.jp/slide/1909 b.php がビルドコマンドになります(要PHP)。パッケージ名のほかに、-m -y -g -j などのオプションを指定できます。 build/b.php パッケージ名 -m -m, -y, -g は MS, Yahoo, Google 製のコンパイラで Minify します。 -j はコメントの削除とファイルの結合だけを行います。 ビルドに成功すると、 uupaa.js と build/mini.パッケージ
jQuery.live っぽい実装 - latest log
submit, focus, blur, change をクロスブラウザにする方法を追記しました。 最新版のコードを追記しました。 デモを追加しました。 jQuery.live() は document.addEventListener(type, fn, capture) で、天辺までバブルアップしてくるイベントを拾う 拾ったイベントが CSS のセレクタ式(expr) に一致するか比較 一致していれば登録されている fn をコールバック という処理をやっているようです。 # 注意: jQuery のコードを見ずにしゃべってるよ そんな感じのを実装してみた var _livedb = {}; // { "expr\vnamespace.click": {...}, ... } uu = uumix(_uujamfactory, { // uu(expr, ctx) -> Instance
uupaa-0.7.alpha2.js - latest log
先ほど固めてみました。 zip: http://code.google.com/p/uupaa-js/downloads/list ブランチ: http://code.google.com/p/uupaa-js/source/browse/#svn/tags/0.7_alpha2 ザックリとした Change Log -uu-background: -uu-canvas(ident) を追加 uu.ajax.queue(), uu.jsonp.queue() を追加 uu.color() の戻り値を変更 ES5(ECMAScript-262 5th)で追加された、Array,Number,Boolean,String系の関数/メソッドをコアに組み込み uu.tween() の高速化 window.getComputedStyle() を IE6+ でサポート 詳細な Change Log
+new Date を Date.now() に差し替えると200〜400% 高速化も - latest log
CSS を利用したアニメーションでは、必ず現在時刻を取得するコードが入ります。 var now = +new Date; ECMAScript-262 5th では Date.now() が新しく追加されました。 Date.now() は +new Date と同じ機能(現在時刻を数値で返す)を持ちながら、new の必要がないため速そうです。 ベンチ <!doctype html><html><head><title></title> </head><body> <script> window.onload = function() { Date.now || (Date.now = function() { // Date.now が実装されていないブラウザ用の実装 return +new Date; }); job1(); job2(); } function job1() { var
もっと速くするために(トップレベルオブジェクトの省略) - latest log
昨日の続きです。 ブラウザで動作する JavaScript では、トップレベルオブジェクト(window)を省略できます。これにより、window.setTimeout や window.document と書くかわりに setTimeout や document と書いても動作します。 今日は、省略すると速くなるのか調べました。 window.userObject1 = 0; // プリミティブ型 window.userObject2 = []; // Array window.userObject3 = {}; // Hash // window.xxx でアクセス function job1(n) { for(var i = 0; i < n; ++i) { ++window.userObject1; window.userObject2.push(i); window.userOb
理由がない限り、Array.join("") による文字列連結は使わないほうがいいみたい - latest log
JavaScript の勉強を開始したときに「文字列の連結には Array.join() を使え」といった記事を見た覚えがあります(ソース失念したけど、 Operaの技術文書だった気がする ⇒ IE の技術文書だったかも)。 一年ほど信じてて、念のためベンチとってみたら「うそやーん」でした。ってお話。 ベンチの条件は、 3種類の文字列連結方法を試す 1. + Operator 2. String.concat() 3. Array.join("") 文字列の要素数を 11個 と 55個で試す <!doctype html><html><head><title></title> </head><body> <script> window.onload = function() { var now = +new Date, lp = 100; while (lp--) { job(); } d
日本語でJavaScript - latest log
前衛的でギルティなコードを目指してみた。 <body> <div id="defs" title="constructor,document,body"></div> <script> 定義 = defs.title.split(","); 窓 = this; 発火 = (0)[定義[0]][定義[0]]; 本体 = 窓[定義[1]][定義[2]]; 発火('本体.innerHTML' + '="<img src=http://www.google.co.jp/images/nav_logo4.png>"')(); </script> </body> 発火() の仕組みは hoshikuzu さんの記事を参考にしています。 http://d.hatena.ne.jp/hoshikuzu/20080317
JavaScriptの高速化3 - Hashによる検索を活用することで、ドラッグをもっとスムーズに - latest log
IE6のベンチスコアを追加 補足を追加 アイコンやウインドウをつかんでずずっと移動する。 この動作をもっともっとスムーズにするために、何ができるか考えてました。 以下はサンプルコードです。 uuClass.MyDrag = uuClass.Generic(); uuClass.MyDrag .prototype = { construct: function() { // ウインドウを包括するオブジェクト this._frame = uu.id("WindowFrame"); // ウインドウのタイトル部分でmousedownされたらhandleEventを呼び出す。 uu.event.set(this, uu.id("WindowTitle"), "mousedown"); }, handleEvent: function(evt) { uu.event.stop(evt); // イベ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
uuAltCSS.js をリリースしました。 - latest log