外部JavaScriptの動的ロード - os0x.blog
JavaScriptからJavaScriptを読み込むのは、(IEに対応する場合は特に)結構面倒です。 ちょうど昨日公開されたid:amachangのはてブにアクセスチャートを出す Greasemonkeyでは、こんな実装になっていました。 // for IE if (!document.evaluate) { var script = document.createElement('script'); script.src = 'http://svn.coderepos.org/share/lang/javascript/javascript-xpath/trunk/release/javascript-xpath-0.1.11.js'; document.body.appendChild(script); var callee = arguments.callee; var inter
Google ChromeのJavaScriptデバッガの進化がすごい - os0x.blog
Chrome版のFirebugことGoogle Chrome Developer Toolsですが、以前gihyoで解説したときよりさらに便利になっているので、少し紹介します(元はWebKitなので、そのうち(近いうちに)Safariでもそれなりに使えるようになるはずです)。 圧縮されたコードの整形 まず、目立つところからいきましょう。ちょうど先日更新されたChromeのdev版(12.0.742.0)に搭載されたばかりの機能で、minifyされているJavaScriptコードを読みやすいように整形して表示してくれるというものです(IE9の開発者ツールにも実装されている機能です)。 例えば、Google Analyticsのコードは圧縮されていて普通は読めません。 しかし、Chromeのデベロッパーツールなら、 このように整形してくれます。 やり方は簡単で、デベロッパーツールのScript
prototype.jsからjQueryに移行するたったひとつの冴えたやりかた - os0x.blog
どうもこんにちは、os0xです。 実は(Twitterに書いただけで)ブログに書いてなかったのですが、3ヶ月ほど前からクックパッドで働いています*1。なんかもう今更ですよね、すみません。 さてさて、クックパッドですが、つい一昨日までprototype.jsを使っていました。で、昨日jQueryへの移行をリリースしたところだったりします。 というわけで、その辺の話を少し書いてみたいと思います。 そもそも、なんでjQueryに移行するのか まあ、prototype.jsとjQueryどちらを使うかと問われたら、大抵の人はjQueryと答えますよね。確かにjQueryの使いやすさは魅力的です。使いやすいということは、みんなでjQueryを使ってサービスを作ることができます。特定の誰かに依存してボトルネックになったりすることがないなら、それは素晴らしいですね。 しかし、ライブラリを変えるのは簡単な
script, styleタグ内のコードの書き方 - os0x.blog
# 最初にちょっと余談を。Chromium-Extensions-JapanのほうにChrome6 Betaの変更点を書きました。どうぞよろしく。 さて、scriptタグ内をHTMLコメントで括ってからJavaScript書くのって意味あるの? - Togetterの件に関して、関連ネタをいくつか書いておきます。。 まず前提として、scriptタグの中に直にコードを書くというのはできる限り避けたほうが良いです。とはいえ、ちょっとしたコードをいちいち外部ファイルにしていると読み込みのコストも馬鹿にならないので、インラインで書く事もよくあります。なので、以下は主に数行程度のコードをインラインに書く場合の話です。 scriptタグの中に直にコードを書くときはscriptタグに非対応なブラウザのために<！--で始め*1 // -->で閉じるというノウハウは今でも結構使われているみたいです。 しかし
プログラミングに最適なConsolasとかInconsolataとか - os0x.blog
でInconsolataだけが紹介されているので、おまけ情報を少々。 Inconsolataというのは、Windows Vista/7 に標準で付属しているConsolasフォントに感銘を受けた作者がConsolasを意識して作ったフォントです。 ConsolasのほうはVista/7だけでなく、Visual Studioに付属してたりもします。一応、こちらからダウンロードもできるようです。 Download: Consolas Font Pack - Microsoft Download Center - Download Details Windows(少なくとも7では)ではConsolasのほうがより(ClearTypeの効きが)綺麗だと思います。というか、InconsolataはWindowsだとどうも今一つ…、ただMacやLinuxではWindowsでのConsolasと同じくら
Chrome Keyconfig ver 1.4.1をリリースしました - os0x.blog
詳しい更新情報等は ChromeKeyconfig からどうぞ。以前のバージョンをインストールされている方は自動でアップデートされるはずです。 今回は、現状のChromeKeyconfigでどんなことが出来るのかざっくり解説します。 まず、メイン機能はキー入力へのアクションの割り当てです(いわゆるショートカットキー)。割り当て出来るアクションは、タブの開閉、隣接タブへの移動、URLに移動(ブックマークレットの実行も可能)、id:edvakfさん作のHit-A-Hintのほか、AutoPatchWorkとの連携なども可能です。 あえてデフォルトでは無効にしていますが、設定次第ではLDRizeやスムーズスクロールも可能です。 ショートカットキーはサイト側で設定されたキーとぶつかってしまう問題が良く起こりますが、その解決策として通常モードと制限モードという2つのモードを導入しています。デフォルト
AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ - os0x.blog
以前からある手法から順番に見ていきます。 ページの高さの監視 setIntervalでページの高さを監視して、増えていたらAutoPagerizeが動いたとみなして処理を行う var THRESHOLD = 300; var _height = window.innerHeight; setInterval(function(){ if (window.innerHeight - _height > THRESHOLD) { // 処理 } _height = window.innerHeight; }, 300); メリット AutoPagerizeだけでなく、はてなダイアリー・ブックマーク、Twitterなどでのサイト側でのページの継ぎ足しにも対応できる デメリット THRESHOLDをいくつにするかなど、一概に決められない。タイマーをたくさん回すと重くなる。Floatしている要素を継
DOM取得のパフォーマンス比較 - os0x.blog
心に宇宙は満ちているでChromeのXPathが遅いあたりが気になって、軽く検証してみました。 Speed Test. links, elements, xpath, querySelector! 単純にリンク要素を取得、走査 リンク要素を取得、#を含み、テキスト(手抜きでinnerHTML)が25で終わるリンクを検出 という2つのパターンについて、それぞれ document.links document.getElementsByTagName('a') XPath querySelectorAll で実行し、パフォーマンスを計測しています。 各ブラウザごとに特徴が出ていて、FirefoxではXPathが複雑になったほうがむしろパフォーマンスがあがっていたり、確かにChromeではXPathのパフォーマンスがいまひとつのようです。 まとめとしては、単純な条件で要素を取得したい場合はget
Google CodeでMercurialを使う - os0x.blog
先日のGoogle I/OにてGoogleWaveの影でこっそりと、Google CodeでのMercurialのサポートが全面的に公開されました。 The Google Code Blog: Mercurial Now Available to All Open Source Projects (それまでは限定的にMercurialが使える状態でした) 日本ではgitの方が優勢のようですが、MercurialはPage not found - VecTraceやTortoiseHgなど開発環境が揃っている点が魅力的です。 今までは手軽なHosting先がなかった点がネックだったわけですが、Google Codeが正式に対応したおかげでMercurialを始める準備が整いました。 僕が知らなかっただけで、Free source code hosting — Bitbucketという素晴らし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
