document.lazy_writer
特定のscript中に含まれるdocument.writeを上書きして、遅延描画にすることができます。 document.writeを使う広告配信スクリプトや、ブログパーツなどの挙動を置き換えることが出来ます。 外部サーバーから読み込むスクリプトをページ最後部に記述することでページレンダリングを妨げなくなります。 このページはこんな感じになってます。 var adsense_url = 'http://pagead2.googlesyndication.com/pagead/show_ads.js'; document.lazy_writer(adsense_url, function(str){ var id = "adsense_" + this.script_count; document.getElementById(id).innerHTML = str; }, {delay :
最速インターフェース研究会 :: 全てのWeb開発者必見 : remember the milk のサインアップフォーム
ライブドアの次世代テクノロジーセミナーの後の二次会の後のSledge勉強会で発表したネタ。 http://www.rememberthemilk.com/signup/ Ajaxを使ったTODO管理やらリマインダサービスらしいのですが、これのサインアップフォームがとてもよく出来ています。苗字と名前から自動でアカウント名を補完してくれたり、それをサーバーに問い合わせてそのアカウントが取得できるかどうかを確認してくれたりします。 肝心のサービスの中身は使いやすいのかどうか良くわかんないというか、正直微妙な感じなんですが、一度しか通過しないサインアップフォームを作りこむ心意気が良いですね。 別に必見ってほどでもないか。でも知ってる人がいなかったのでブログに書いておくことにします。 ユーザーを「手厚く」サポートする UI 最速インターフェース研究会さんの 全てのWeb開発者必見 : remembe
最速インターフェース研究会 :: 実践JavaScriptリファクタリング、その2
連載すんの？ リファクタリングとか嘘で実は実践ビルトインオブジェクトハックなんだけど。 例題 配列 a = [3,5,4,2,1] から一番小さな値と、一番大きな値を取り出すにはどうすればいいか。 多分昔はこんな風に書いてたと思うんですよ。 a = [3,5,4,2,1]; for(i=0;i<a.length;i++){ if(i == 0){ min = a[0]; max = a[0]; } if(min > a[i]){min = a[i]} if(max < a[i]){max = a[i]} } 模範解答として、後先考えないやり方を提示しておく。 a = [3,5,4,2,1]; min = a.sort().shift();// 1 max = a.sort().pop(); // 5 短い。ただし、これをやるとaの内容は並べ替えられて最初と最後の要素が取り除かれる。 a /
最速インターフェース研究会 :: 実践JavaScriptリファクタリング
同じ事をやるにも、いろんな書き方があるわけでいかにして短くてわかりやすいコードを書くかというノウハウを紹介します。 例として"abcde"を80回繰り返した文字列を作るとして実際に自分のコーディングスタイルがどんな風に変化していったのか、という。 短くなるのは確かなんだけどわかりやすいかというと、人によるかもしれない。 グローバル関数を定義2年前なら、多分こういう具合だった。 //ふつうに関数として定義する function x(str,num){ var tmp = ""; for(var i=0;i<num;i++){ tmp += str; } return tmp; } x("abcde",80) Stringのメソッドとして定義1年前だとこんな感じ。 //Stringのメソッドとして定義する String.prototype.x = function(num){ var tmp
最速インターフェース研究会 :: beyond.jsってなに？の巻
こどもてれびに対抗して巷のJavaScripterの間で最新流行のbeyond.jsってライブラリの解説をします。 beyond.jsとは 知らないやつはモグリといっても過言ではないぐらい有名なライブラリです。 嘘です。どれぐらい使われているのかは良くわかりません。 Ajaxとか全然関係なくて、純粋にJavaScriptのライブラリです。 beyond.jsはここからダウンロードできます。 http://w3future.com/html/beyondJS/ Beyond JS is a Javascript library that lets you write Javascript unlike anything you've ever written. Your code will never be the same again. It contains both useful, f
日本語テキストをテーブルで表示する：高速化バージョン
いやなブログ: 日本語テキストをテーブルで表示するの高速化バージョン。 DOMでのHTML組み立ては非常に遅くてJavaScriptの配列で組み立ててから 一気にinnerHTMLに代入したほうが速い。特にIEの場合は差が顕著、5倍ぐらいは速いはず。 DocumentFragmentを使うという手もあるが、2倍程度にしか速くならなかった。 innerHTMLを使ったほうが良い、というわけではなくて時と場合によりけり。 innerHTMLとappendChildを組み合わせて使うと大体の場合最速。 こういうやつ tmp = document.createElement("div"); tmp.innerHTML = 複雑なHTML; body.appendChild(tmp); body.innerHTML += tmp.innerHTML は絶対に避ける。innerHTMLの読み書きは、ど
最速インターフェース研究会 :: XMLはメタデータというより生データとしての利用価値が高まりつつあり、AjaxによるUIの切り離しがそれを加速する
全部まとめて色々書こうかと思ったのだけれど、どうにも上手くいかないので、少しずつ分割して書くことにする。 まず最初にこれなのだけれども http://johnvey.com/features/deliciousdirector/ これは何かというと「JavaScriptで書かれたdel.icio.us APIのクライアント」である。最初に全てのブックマークを受信して、その後のタグによる絞込みなんかは全てJavaScriptで行う、というものだ。 とりあえず、実際にこのデモを見るのが早いだろう。 http://johnvey.com/features/deliciousdirector/demo.html この方式では、ブックマークの件数が1万件を超えるようなケースになると破綻することがわかっている。 del.icio.usのAPIでは特定のタグを含むブックマークを取り寄せることも出来るので
最速インターフェース研究会 :: テンプレートエディタを作ってみた
こんなのを作ってみました。 http://la.ma.la/misc/tmpledit/ HTMLソースを貼り付けて、ページの構造をダンプすることが出来ます。 とりあえずどんな感じかわかるように、このBlogのアドレスを入れてあるので取得ボタンを押すと出て来る様になってます。XMLHTTPでソース受信してるので外部ドメインのソース取得は無理です。ローカル保存+IEの場合は外部ドメインのソースも解析できます。 こういう感じの作るやつ、と言えばわかりやすいかも。 http://d.hatena.ne.jp/kamioka/20050609/1118324980 まあ、これがやりたかっただけなのですが、ついでにCSSの編集もできるようにしてみました。CSS編集モードに切り替えると、タグ名とクラス名とIDを確認しながらプレビューしつつその場でCSSを編集できます。 CSS適用ルーチンはこれの丸パク
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
