table-layout: fixedでページの表示速度を上げる

February 27th, 2012

table © by zoetnet

tableタグ(又はその親要素)にtable-layout: fixedを指定すると、1行目だけを元に表の列の幅を決定し表示します。
デフォルトではtable-layout: autoとなっており、2行目以降も含む、テーブル全体の要素から列の幅を決定します。

後者は表内の要素によってフレキシブルに表示される利点がありますが、行数の多い表だと表示速度が遅くなります。
行数の多い表では、列の幅を決めてtable-layout: fixedを指定するのがよいです。

ネタ元:Use the table-layout CSS property to speed up table rendering

jQueryのCSSセレクタ高速化、ver.1.2以前と1.3以降で異なる

February 21st, 2012

Cheetah © by flickkerphotos

ページ表示高速化Tips。
jQueryのセレクタはバージョンで高速化の手法が異なります。
Ver.1.3以降では高速なセレクタエンジンSizzleが採用されたため、
できるだけそれを使うようにしたほうが高速。
具体的には下記のサイトが詳しいので参照してください。

Ver.1.2以前はdiv.classのほうが速い。
jQuery を高速に使う CSS セレクタの書き方 – てっく煮ブログ

Ver.1.3以降は.classのほうが速い。
jQueryのCSSセレクタAPIを高速に扱う方法 | tech.kayac.com – KAYAC engineers’ blog

Google+ APIで取得したJSONデータをフィード形式に加工する

January 16th, 2012

Transparent chemistry glass tubes filled with substances © by Horia Varlan

Google+の自分の投稿内容(JSON)をPHPで取得して別のサーバーに保存するで取得したデータを、フィード形式に加工して表示します。

APIから出力されるデータ項目はGoogle+の開発者用ドキュメントに解説がありますが、実際のデータをprint_r()関数で表示して内容を見たほうがわかりやすいかもしれません。

[続きを読む]