Stylishでtumblrのダッシュボードを軽くできた件 ― 2008年09月21日 19時05分51秒
以前、Firefox3でtumblrのダッシュボードが重いって愚痴エントリを書いたのだが、ふとしたことでこれが解決したのでメモ。
やっぱりメインはFirefox3、なんだけど。
ChromeでもMinibuffer+LDRizeが動くのでダッシュボードをつらつらと見たりして遊んでるうちに、やっぱりこの操作感が気持ちいいので久々にFirefox3でもLDRizeをONにしてみたのだが、やっぱり重い。
いや、LDRize云々以前に、普通にスクロールさせるだけでも猛烈なストレスなわけで、「やっぱPC買い替えかぁ?」とか思ってたのだが、ふと「なにがボトルネックになってるのだろうか」と疑問。
Firebugでスタイルを表示してみて、いろいろ試したところ、「ol#posts li.post」(個別エントリの要素)に
-moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px;なんて、不思議な指定があるのを見つけた。名前から推測するに、ボックスの角を丸めてるっぽい。
ためしにFirebug上でこれらを0px指定にしてみたら、スクロールがかなり軽くなった。これが原因か!
で、Stylishの導入ですよ
ということで、tumblrのダッシュボード向けに-moz-border-radius-*を無効にできれば快適なダッシュボード生活がまた戻ってくると判明したのだが、どうやってそうやるんだ?
ユーザスタイルシートやらいうキーワードは聞いたことがあったので調べてみると、Stylishという機能拡張を導入すると、グリモンでユーザJSを適用できるようにサイトごとにスタイルシートを設定できる、と。
さっそくインストール、見よう見まねでこんなスタイルを書いてみた。
@namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain("www.tumblr.com") { ol#posts li.post { -moz-border-radius-bottomleft: 0px !important; -moz-border-radius-bottomright: 0px !important; -moz-border-radius-topleft: 0px !important; -moz-border-radius-topright: 0px !important; } }ちなみに後ろの「!important」をつけないとうまく適用されなかった。
やっぱり重く感じてた人は他にもいたんだねぇ。
で、あんまりうれしくなったので上のスタイルをtumblrにPOSTしたら、さらに徹底的に改良したreblogが。
特にアバター(ユーザのアイコンみたいなもの)にまで適用したことで、notesを表示するときのアコーディオンエフェクトもずいぶん軽くなり、ほんとに快適。ありがたや、ありがたや。やっぱりv4になってから重たいと感じてた人は他にもいたのだなぁ。
最終的には先のtizooo氏のをベースに自分のPOSTと他の人のPOSTを若干色分けするルールを追加してこんな感じに落ち着いた。
こちらが適用前(デフォルト)。
で、カクカク適用後はこんな感じ。
ついでにGoogleも。
実はGoogleの検索結果も、表示している内容のわりに妙に重かった。これまたFirebugで調べて突き止めた原因が、font-familyのArial指定。これでなんでそこまで重くなるのかはわからんけど、ともかくarial指定を解除することで軽快になることだけは確か。ってか、俺のPCどんだけ重いのかと。
ということで、Google向けにこんなのやってみたり。
@namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain("www.google.co.jp") { body, td, div, .p, a { font-family: sans-serif !important; } }
まぁ他にも重いサイトはあり、場合によってはユーザスタイルシートじゃどうもならんところもあるんだろうけど、利用頻度が高いところをこうやって潰せるとまだまだこのPCでも使えるかなぁ、と思ったり。
コメント
トラックバック
このエントリのトラックバックURL: http://dara-j.asablo.jp/blog/2008/09/21/3778011/tb
※なお、送られたトラックバックはブログの管理者が確認するまで公開されません。
コメントをどうぞ
※メールアドレスとURLの入力は必須ではありません。 入力されたメールアドレスは記事に反映されず、ブログの管理者のみが参照できます。
※なお、送られたコメントはブログの管理者が確認するまで公開されません。