prototype.js でデザインパターン - Iterator
Ruby on Rails や Catalyst のプラグインなんかでは prototype.js という JavaScript のライブラリを使って、Ajax サポートを実現しています。prototype.js とフレームワークが必要な Ajax の JavaScript コードを吐き出してくれるので、Ruby プログラマや Perl プログラマは JavaScript の実装を意識しなくても Ajax なインタフェースが作れる、という風になっています。 こんな感じで prototype.js は Ajax な部分に注目が集まっていますが、ほかにも "Class-style OO" なフレームワークも内包してます。 JavaScript はプロトタイプベースのオブジェクト指向言語で、C++ や Java のようなクラスベースのオブジェクト指向言語とはちょっと実装が異なります。プロトタイプ
川o・-・）＜2nd life - MochiKit
http://mochikit.com/ http://mochikit.com/screencasts/MochiKit_Intro-1.html 名前はご存じの人も多いと思われるJavaScriptライブラリMochiKit。自分もJavaScriptライブラリはprototype.js + scriptaculousで決まり、みたいな感じでMochiKitには全然注目してなかったのですが、screencast見ると凄さが解るとtypoさんのCLONに書いてあったので見たらスゲーと思いました。まだ見てない人は必見！ prototype.jsがクラスベースのOOPみたいなことをしてライブラリを形成してるとしたら、MochiKitはJavaScriptらしく良い意味でどんどんグローバルな関数を定義して使い勝手を向上させてます。また標準のexampleに入ってるinterpreterがブラウ
川o・-・）＜2nd life - prototype.js with mousehweel event
http://rails2u.com/misc/wheel_event/ prototype.jsではイベントハンドラの登録をEvent.observeに追加することにより行えます。これはWinIEだとelement.attachEvent, Firefoxだとelement.addEventLisnerと登録用の関数が違う互換性を吸収してくれるので大変便利です。しかし、ホイールイベントは少々特殊なため、通常のEvent.observeでは上手く登録が行えません。 ホイールイベントをwebアプリケーションで上手く使うとユーザビリティの向上が見込める*1ので、簡単にホイールイベントを登録できるEvent.observeを作ってみました。上記URL先のwheel_event.jsをprototype.jsを読み込んだ後に読み込むことによって、mousewheelイベントを扱えるようになります。
最速インターフェース研究会 :: JavaScriptでDebugScreen、その2
Bookmarkletを作った 最速インターフェース研究会を参考にして、ソースを表示するブックマークレットを作った。Firefox のソースを見る機能は、遅いしCGIとかだとリクエストを再送しちゃうし、けっこうダメダメ。これは Javascriptで動的にコードを生成するような場合でも、その時点でのソースを表示できる。 javascript:(function(){var HTMLtext = document.getElementsByTagName("*").item(0).innerHTML;var HTMLline = HTMLtext.split(/\n/);HTMLline = map(HTMLline,function(line,i){ var ln = i+1; var t = mul(" ", 5 - ("" + ln).length) + ln + ": " + esc
for 文 2.0(笑) - IT戦記
まぁ、かなり知られてる話ですが JavaScript は .(ドット) の計算がかなり遅い。まぁ、簡単なスクリプトなら問題にならないが。web2.0的には大違いなのであります。ちなみに、.(ドット) の計算に比較演算の 3 倍のコストがかかる（IEはとくに）。 ということで、for 文は下のように(比較に .(ドット) を使わない)書くくせをつけましょう。地道な差が大きなパフォーマンスを生みます。 // for 文 2.0 for(var i = 0, len = array.length; i < len; i++) { .... }各種ライブラリの for 文 1.0 を for 文 2.0 化するだけで、CPU 使用率がけっこう下がりました。 予断ですが、間違っても .(ドット) を避けるために with 文を使うようなことはやめてください。 with 文のコストは 比較演算の 8
IT戦記 - 複雑で重くなった JavaScript を超超ちょ???高速化する方法。
前回(id:amachang:20060104)の改良版です。前回のでやっていたら、queueを走査する時間がかかりすぎるようになって結局崩壊してしまったので、さらに改良しました。ただし、今回のは時間が多少ずれる場合があります。なので、ストップウォッチなどのプログラムを作る場合は使わないでください。 主な改良点としては .(ドット) 減らす。 文字列リテラルをループ中に記述しない。 ループ。ループのネストを減らす。 new を減らす。 関数コールを減らす。 より早い演算を使う。(+1 を ++ にするとか。他にもいっぱい) これで、めっちゃ早くなりました。やヴぁいです。 ミニマム版 var _SIi=10,_SIM='第一引数が不正です。',_SIl=0,_SIc=0,_SIS ='string',_SIF='function',_SIf=window.setInterval,_SIp=[
JavaScript のデバッグ方法
JavaScript のデバッグ方法 2006-01-07-7: [JavaScript] http://memo.xight.org/2006-01-04-7 JavaScript のデバッグ方法各種． Firefox 拡張の Venkman JavaScript Debugger はかなりいい感じ． 適当に触ってみたけど，簡単に使える．ブレークポイントを設定できたり，変数のウォッチができたりかなり使える． - Venkman for Firefox 1.5 http://getahead.ltd.uk/ajax/venkman
メモ、X Library - FAX
メモ、X Library メモ どのような機能があるのかを知りたい気持ちから翻訳を行なった。 初めは1時間程度で終わるように思った。 Del.icio.usでのブックマーク数も全体で500程度と多い。 以下は、X Libraryについての感想。 全ての関数がグローバルに置かれる。 ウィジェットもあれば、文字埋め(パディング)、型チェックもあり、各機能の粒度はバラバラ。 クラスが少なく、全体的に関数的なライブラリ。但し、返り値がオブジェクトなど独特の関数インターフェイス設計。オブジェクト指向と関数指向の中間的なデザイン。 XMLHttpRequestなどのAjax通信用の機能はなし。スクリプトローダーはあり。 座標、相対位置、アニメーションなどの機能が豊富。 xSequence Experimentの配列を使ったDSLの文など、コードは基本的にきれい。ifやforの深いネスト/インデントなど
web.paulownia.jp - ロールオーバーのオブジェクト指向的実装
Java等のオブジェクト指向はクラスベースのオブジェクト指向と呼ばれる。一方、JavaScriptはプロトタイプベース、あるいはインスタンスベースオブジェクト指向と呼ばれる。 クラスベースは、まずクラスを定義し、クラスを型とするインスタンスを作成することでプログラミングする。プロトタイプベースによるオブジェクト指向では、クラスの定義は必須ではなく場合によってはクラスという概念自体が存在しない。既存のオブジェクトのクローンとして新しいオブジェクトを作成し、そのオブジェクトに独自の性質を付加してプログラミングする。 JavaScriptのオブジェクトの性質は動的に変更可能。Java等では一度決定したオブジェクトの振る舞いは変更できないが、JavaScriptでは実行中の任意の場所でメソッドの動作を変更したり、新しく追加したり、削除したりすることができる。
はてなの複数アカウントを切り替えるブックマークレット - FAX
練習以下は、クッキーの削除とログインを行い複数のアカウントを切り替えるブックマークレットです。配列に格納されたユーザIDを順番に循環しながらアカウントを変更していきます。はてなのサイト内なら任意の場所で実行できます。 javascript:(function(){var p="pass",us=["id1","id2"],ui=0,e=new Date,h="hatena.ne.jp",d=";domain="+h+";path=/";with(document){try{ui=++(cookie.match(/ll=(\d+)/)[1])%us.length;}catch(ex){}e.setMonth( (e.getMonth()+1)%(12));cookie="ll="+ui+d+";expires="+e.toGMTString();cookie="rk="+d;location
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
DrawingCanvas.js - クロスブラウザなベクタグラフィック描画ライブラリ - memo.xight.org