タグ

ブックマーク / os0x.hatenablog.com (7)

  • 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

    Google ChromeのJavaScriptデバッガの進化がすごい - os0x.blog
  • prototype.jsからjQueryに移行するたったひとつの冴えたやりかた - os0x.blog

    どうもこんにちは、os0xです。 実は(Twitterに書いただけで)ブログに書いてなかったのですが、3ヶ月ほど前からクックパッドで働いています*1。なんかもう今更ですよね、すみません。 さてさて、クックパッドですが、つい一昨日までprototype.jsを使っていました。で、昨日jQueryへの移行をリリースしたところだったりします。 というわけで、その辺の話を少し書いてみたいと思います。 そもそも、なんでjQueryに移行するのか まあ、prototype.jsとjQueryどちらを使うかと問われたら、大抵の人はjQueryと答えますよね。確かにjQueryの使いやすさは魅力的です。使いやすいということは、みんなでjQueryを使ってサービスを作ることができます。特定の誰かに依存してボトルネックになったりすることがないなら、それは素晴らしいですね。 しかし、ライブラリを変えるのは簡単な

    prototype.jsからjQueryに移行するたったひとつの冴えたやりかた - os0x.blog
  • MacをJavaScriptの開発環境にするメモ - os0x.blog

    以前は自宅も仕事Windowsメインな環境だったんですが、仕事の方がでMac+英語キーボードな環境になり、ついでなので自宅もそれに合わせることにしました。 環境はMac miniの最新型で一番安いの(6月くらいに購入)とMacbook Airのやっぱり一番安いの(11月に購入)です。両方合わせて15万くらい。お手頃…なのか?どうでもいいけど、mac miniは1.3kgしかなくて、Macbook Airの13インチとほぼ同じ重さだっりします。miniデスネー。 ついでにWindowsのほうは2年半前に買ったCore2duo(Windows7アップグレード済み)で、当時そこそこハイエンドだったやつです(ちょうどMac miniと同じくらいのスペックだけどこいつは一体何kgあるんだろう…)。 以下、Macの開発環境をなるべく最近の流行りを取り入れてレポートします。 ブラウザ さて、マシンのセ

    MacをJavaScriptの開発環境にするメモ - os0x.blog
  • 「続・ハイパフォーマンスWebサイト」レビュー - os0x.blog

    Chrome Extensions TechTalkの日に、Googleの及川さんから「続・ハイパフォーマンスWebサイト」を頂きました。 続・ハイパフォーマンスWebサイト ―ウェブ高速化のベストプラクティス 作者: Steve Souders,武舎広幸,福地太郎,武舎るみ出版社/メーカー: オライリージャパン発売日: 2010/04/10メディア: 大型購入: 20人 クリック: 342回この商品を含むブログ (26件) を見る ロードの高速化、処理の高速化を中心に、ロード順の問題や、gzipやwoker、Comet、非同期ロード、CSSスプライトにCSSセレクタの最適化などなどウェブサイトを高速にするためのテクニックが十分に詰まった一冊です。特に、日語版の特別付録として、パフォーマンスの測定ツールの解説がついています。パケット解析系は種類があるのでありがたいです。開発ツールでは、

    「続・ハイパフォーマンスWebサイト」レビュー - os0x.blog
    hiroomi
    hiroomi 2010/04/12
  • word highlight ver1.0.9 - os0x.blog

    word highlight for Greasemonkey Googleニュースでもハイライトしたいというリクエストに対応、あと、さりげなくYahoo!Japanにも。 1.0.7から1つ飛んでるのは間にChrome用の更新があったからです。 で、試験的にcanvasで単語の位置を描画してクリックで大体の位置に移動できる機能を搭載してたりします。右下のボックスにマウスを載せると出てきます。まだアイデアを練りきれてないので、オマケ程度に見ていただければと…(縦長のページとか、イマイチです)。

    word highlight ver1.0.9 - os0x.blog
    hiroomi
    hiroomi 2009/11/16
  • Google Chrome 2.0 で使える(自作の) User Scripts - 0x集積蔵

    やけにあっさりと Google Chrome 2.0 がリリースされました。 というわけで、Greasemetal, GreaseKit で使える UserJavaScript (自作中心) - 0xFFのGoogle Chrome 2.0版(今回は自作のみ)です。 最初に、GreasemetalはGoogle Chrome 2にGreasemonkey相当の機能が実装されたため、開発を終了しています。ので、以下はChromeに搭載されたUser Scriptsを対象とします。(ちなみに、User Scriptsを書いてみようという方は、Google Chrome 2.0のUserScriptsはGreasemonkey互換のようで、そうではない - 0xFFをチェックしておくと良いかもしれません) User Scripts の導入 起動時に --enable-user-scripts オ

    Google Chrome 2.0 で使える(自作の) User Scripts - 0x集積蔵
    hiroomi
    hiroomi 2009/09/18
  • AutoPagerizeの動作の流れ - os0x.blog

    AutoPagerize くらいは - twwp宛て。 家swdyh版について(oAutoPagerizeも主な流れは同じだけど)、ざっくりと処理の流れを(細かいところやメインでない部分は省いています)。 ページの読み込み→Greasemonkey起動(この辺は省略)、AutoPagerize起動 SITEINFOの読み込み SITEINFOの期限が切れていた場合、wedataから最新を取得 URLにマッチするSITEINFOがあるかチェック、なければ終了 SITEINFOのXPathが機能しているかチェック、XPathで要素を取れなかったら終了 初期化処理 次のページのURL取得 差込位置の決定、insertBeforeか、pageElementの最後の次の要素 右上アイコン・ヘルプの設置 スクロール監視の開始 読み込み開始位置の決定(どこまでスクロールしたら次のページを読み込むかは、

    AutoPagerizeの動作の流れ - os0x.blog
    hiroomi
    hiroomi 2009/05/09
    文書の構造化ができてる人はすばらしい。って文書みて思った。
  • 1