IT戦記 - 一行で IE の JavaScript を高速化する方法
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
JavaScript から MML を再生する - JSMML - 2nd life (移転しました)
http://coderepos.org/share/wiki/JSMML テキスケ: ActionScript日記 - サウンドのリアルタイム生成（４） で公開されている、Flash から MML を再生できるライブラリ、 FLMML が素晴らしすぎるので、JavaScript からも再生できるようにブリッジを書いてみました。ライブラリ名は JSMML(まんま)。 JSMML を使うと、SWF を経由して JS な API から MML を再生できるようになります。 <script type="text/javascript" src="JSMML.js"></script> <script type="text/javascript"> JSMML.swfurl = 'JSMML.swf'; // default // onLoad に関数を入れておくと、SWF のロード完了時に呼ばれ
ハタさんのブログ : Javascriptによる大規模開発の覚え書き。高速化編
前回書いた「Javascriptによる大規模開発の覚え書き」が凄いことになってました。 今回は、省略した「5.高速化せよ」について書きます。 僕にとってjavascriptは非常に高速な言語です。それは何が高速か 開発速度が高速である 開発速度、及びそこに至るまでの修得速度はとても高速です。動的言語を上手く操る開発者はもちろん、開発に不慣れな(言葉が悪いけど)新人達でさえ「動く」モノをサクっと作ってしまえる。 また、プラットフォーム(? というかブラウザ)が広く普及しているので、ググればスグに問題解決もできる。 それにローカルで簡単に作れる。javascript、それは動作環境を含めて高速です。 高速にUI操作ができる(UI操作が非常に簡単である) swingとかでUI操作をするには多くのオブジェクト操作をしなければならないけど、javascript(もといDHTML)は非常に簡単に
mixi 新デザインでグリモン作ったり、スクレイピングしたり、しやすくなった - IT戦記
今回の mixi のデザインのポイントは 全ページで prototype.js の 1.5.0_rc0 が読み込まれている 新しいデザインのページはテーブルレイアウトじゃない 新しいデザインのページは id class 付きまくり いろいろ試してみた prototype.js が読み込まれているか確認する alert(Prototype.Version); // 1.5.0_rc0 ページ内に id が何個あるか alert($$('*[id]').length); // トップページに 52 個！ ページ内に class が何個あるか alert($$('*[class]').length) // トップページに 239 個！ おおすごい！ 試しに日記一覧ページから日記の URL を抽出するワンライナー $$('#bodyMainAreaMain dt a').filter(/view_
ハタさんのブログ : Javascriptによる大規模開発の覚え書き
未だに半年前のエントリにブクマされるみたいなので、もう少しjavascriptについて書いてみる。 今回は大規模化開発におけるJavascriptの注意点とかそういうの。当てはまらない環境の方もいます。(しかも基本的な事だらけで大したことは書いてないです) ほぼリッチクライアントを主目的としたjavascripterとコードを対象とします。 どちらかというと、ライブラリを提供する側の視点から 1.ログを出力せよ あなたが書いたコードは遅い、と必ず言われます。なので言われる前から、自分の書いたコードの処理時間をログするようにしましょう。 次のような処理時間を計測するロガーを作ります。 var TraceLog = function (){ this.startTime = -1; var outer = document.getElementById('_outer'); if(oute
Safari「でも」使える MT Bookmarklet - bricklife.weblog.*
Safari「でも」使える MT Bookmarklet Movable Type のシステムが生成する Bookmarklet を Safari でも動くようにする方法を紹介します。 Apple 製のブラウザ Safari で Movable Type を使っている Mac ユーザは体験していると思いますが、Author 用に用意されている JavaScript がいくつか動きません。特に、Bookmarklet が動かないのがイタイところです。 しかし、幸いにもいくつかのサイトで対応方法が公開されています。例えば、JAVASCRIPT::BOOKMARKLET では Safari 限定の Bokmarklet が公開されていて、僕もこれを使っています。 しかし、やっぱり「自前で書かないでシステムに自動生成させたい」と思うのが男の性です（え？） そして「どうせならどんなブラウザでも動くよ
JavaScriptで外部ライブラリを読み込むためのスクリプトをCodeRepos.orgに上げた。 - ヒルズで働く@robarioの技ログ
Sjaxを使わないJavaScript Loader - ヒルズで働く@robarioの技ログ と JavaScriptから外部JavaScriptを読み込む方法 - ヒルズで働く@robarioの技ログ の改良版です。この二つの記事は忘れてもらって結構です。 前振りとか ライブラリを読み込みたい（＞＜） 「script要素をappendChildする」でやると読み込み完了を待ってくれないので「setTimeoutで3000ms後に本処理」とか、嫌だ。 そこで「指定したプロパティが存在するか」を監視するスクリプトloader.js.incを書きました。http://coderepos.org/share/に置いてあります。 http://coderepos.org/share/browser/lang/javascript/misc/loader.js.inc http://coderep
はじめてのJSONPプログラミング
前回の「ブログの☆の総数を取得できるAPIを組み込みました」では、はじめてJSONPを使ってみました。以下、実際にJSONPを使ってみての覚え書きと、これからJSONPプログラミングをはじめる方へのTIPSです。 ブログの☆の総数を取得できるAPIは、はてなスターに登録されたブログの情報を取得できるJSON形式とJSONP形式で提供されているAPIでした。 はてなスター日記 - ブログの☆の総数を取得できるAPIを追加しました JSONとは、JavaScriptにおけるオブジェクトの表記法をほぼそのまま利用したデータフォーマットのことで、JSONPはJSONにちょっと記述を加えて、クロスドメインのJSONデータを非同期で読み込ませて処理するための手法のことです。（詳しい定義については、自分で調べてみてください） 通常、Webブラウザでは他ドメインのJavaScriptのデータを読み込んで実
ソートが可能なテーブル実装ライブラリ色々:phpspot開発日誌
CSS Juice 16 Sortable Table Techniques Tabular data in table form is a regular technique on web sites and web applications for represent data and information. ソートが可能なテーブル実装ライブラリ色々。 JavaScriptとCSSを活用し、データのソートが可能な便利なウィジェットを実装できるライブラリが多数紹介されています。 Nofunc Table Organize TableKit Brixontech Table Sort Sortable Selectable Zebra Table Kryogenix Sortable Sorting HTML Tables with Javascript SortedTable by M
色分け、自動補完機能などを備えたJavascriptで出来た高機能なコードエディター『CodePress』 | POP*POP
コードを書く人には便利そうなツールのご紹介。 ↑ かなり高機能なエディターです。是非触ってみてください。 JavascriptでできたCodePressを使えば、以下のようなことができてしまいます。 コードを色分け（定数や命令文などがわかりやすくなりますね）。 命令を書いてTABを押すと対応する括弧などを自動補完。 括弧を自動補完。 ショートカットを装備（CTRL+SHIFT+SPACEで「 」など） 対応している言語はPHP、JS、Java、Perl、SQL、HTML、CSSとのこと。これはかなり使えるのでは・・・。 実際の動作デモ＆ダウンロードは以下からどうぞ。 » CodePress – Real Time Syntax Highlighting Editor written in JavaScript
画像にマスクを施せるJavaScriptライブラリ「Edge.js」と画像エフェクトライブラリ集:phpspot開発日誌
画像にマスクを施せるJavaScriptライブラリ「Edge.js」と画像エフェクトライブラリ集 2007年08月06日- Edge.js (with basic IE 6/7 support) Edge.js 1.1 allows you to add individual masks (inc. inbuilt mask) to images on your webpages. It uses unobtrusive javascript to keep your code clean. 画像にマスクを施せるJavaScriptライブラリ「Edge.js」。 Edge.js を使えば次のように、画像にマスクを与えることが可能です。 次のように、JavaScript でマスク画像の配列を定義して、必要ライブラリを読み込んだ後、img タグに適切なクラスを付与する感じになります。 <!--
マウスが上に来るとくるりんと文字の色を変えるスクリプト「Scrollovers」
リンクなどの文字列の上にマウスが来ると自動的にくるりんと回転する感じで文字の色が変化するというちょっと楽しいエフェクトを加えてくれるスクリプト、それが「scrollovers.js」です。 Firefox 2.0、Internet Explorer 7、Internet Explorer 6、Internet Explorer 5.5、Safari 3 (Windows)、Opera 9で動作確認されているとのことで、個人利用でも商用利用でも無料で使用できます。 論より証拠、デモを見た方が理解できます。 デモとダウンロードは以下から。 Scrollovers - A New Way of Linking http://www.scrollovers.com/ 「scrollovers.js」自体の中身がどうなっているかというのは以下からわかります。 http://www.scrollove
画像を立体ガラス風にするエフェクト実装JavaScriptライブラリ「Glossy.js」:phpspot開発日誌
Glossy.js (with IE 6/7 support) Glossy.js 1.3 allows you to add corners and shading and shadow to images on your webpages (alternatively: corner.js). 画像を立体ガラス風にするエフェクト実装JavaScriptライブラリ「Glossy.js」。 プレーンな画像に、次のように画像にガラスのような立体効果を与えることが可能。 必要なライブラリを読み込んで、<img>タグに、class="glossy"を指定するだけでいいお手軽さです。 目立たせたい画像に対してこのエフェクトを指定すると効果的ですね。 IE6,7もサポートしているようです
はてなブックマークについての質問です。ブックマークレットを使ってブックマークする際、いつもポップアップウィンドウのフォーカスがはずれ、背後に回ってしま…
はてなブックマークについての質問です。ブックマークレットを使ってブックマークする際、いつもポップアップウィンドウのフォーカスがはずれ、背後に回ってしまいます。新しいウィンドウが前面にくるようにしたいのですが、以下のjavascriptをどのように修正すればいいでしょうか。環境はFirefox2.0.0.1 Windowsです。 javascript:window.open('http://b.hatena.ne.jp/add?mode=confirm&is_bm=1&title='+escape(document.title)+'&url='+escape(location.href), '_blank', 'width=480,height=360,resizable=1,scrollbars=1');undefined; http://q.hatena.ne.jp/1158445478
Symfony Ajaxで「戻る」を実現する
Ajaxを使ってフォームのフィールドの変化に応じてdivの中身を入れ替えるような処理の場合、ブラウザの「戻る」機能を正常に使うことができなくなります。 フォントサイズの変更や「戻る」「進む」などのブラウザが標準で搭載している機能が使えなくなることはユーザの自由を奪ってしまうことになり、ユーザビリティがよくありません。 いろいろ調べてみたところ、「みかログ: Ajaxと戻るボタン・ブックマーク」というサイトにて対処法を発見しました。 ポイントとしては、 IE以外ではlocation.hashで各オペレーションに対して異なるhashを生成 IEでは隠しIFRAMEにlocation.hash生成 というあたりらしいです。 Javascriptを直接記述する場合は上記サイトのjQueryプラグインで事足りると思いますが、私の場合Symfonyを使用していたため、その中のヘルパ関数であるobser
Javascriptでdiffる ( with 形態素解析 ) (nakatani @ cybozu labs)
Javascript で diff というのはいくつか試された例はあるようですが、まだこれといった決定打は出ていない様子です。 実は diff は見た目ほど軽い処理ではないので、Javascript にやらせるのはこれが結構大変…… diff の計算量は、おおざっぱに言うと比較対象の要素数の二乗に比例し（実際にはそれより小さくすることができるのですが、まあ話のイメージとして）、かつメモリを大量に消費するので、バッチ的な処理に最適化されていない Javascript にはどうしても荷が重いものとなってしまいます。 比較対象の要素数を減らせば当然計算量は減りますが、行単位で比較してもあまり嬉しくない（わざわざ Javascript で処理するということは自然文が対象と思って良いでしょう）。最小の文字単位だとギブアップ。 ということは形態素解析で分かち書きして、単語単位で diff するのが J
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://youmos.com/news/prototype_portal_class
[JS]mootools.jsを使用した気持ちいい動きをする画像ギャラリー
http://youmos.com/news/dfsmoothscroll
http://youmos.com/news/glt_js