[パフォーマンス] CSSとJSをLocalStorageにキャッシュして、2回目以降の表示をちょっとだけ速くしてみる - YoheiM .NET
[パフォーマンス] CSSとJSをLocalStorageにキャッシュして、2回目以降の表示をちょっとだけ速くしてみる こんにちは、@yoheiMuneです。 スマホで回線状況が悪い場合（3Gとか使う場合）に、表示遅いなぁーと思うこと多くないですか？ 今回は、スマホなどの回線が良くない端末で、Webの表示をより速くする方法として、CSSとJSのローカルストレージキャッシュで高速化する方法をブログに書きたいと思います。 CSSやJSは、expireヘッダが付いてキャッシュされてても初期表示の時間を遅延させる？ iPhoneなどのスマホを使っていると、CSSやJSのキャッシュ機能を有効にしても、初期表示までに時間がかかってしまうことがあります。ブラウザがキャッシュを勝手にFIFOのルールなどで消しちゃうとか。 以下の画像は、iPhone5でiOS6でSoftbankの3G回線を使った際に、とあ
![[パフォーマンス] CSSとJSをLocalStorageにキャッシュして、2回目以降の表示をちょっとだけ速くしてみる - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/1962e885cca00fc224f634feab56e3ecfce6b1cd/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F260.jpg)
[JavaScript] CSS3のTransitionを使ったアニメーションが簡単に実現できるJSライブラリ - YoheiM .NET
jQuery Transitを使う際に注意すべき点 jQuery Transiは開発中のライブラリということもあり、tを使う上でいくつかの注意点があります。 GithubのIssueによるとjQuery1.8.2（執筆時の最新）に対応できていない。 Androidで動作しないものも多い。移動は動くけど、回転は微妙。拡大縮小も微妙。 Androidでは1つの要素に対して複数の変化をさせられない。このライブラリでは、この問題を吸収してくれません。 jQuery Transitで気に入った点 jQuery Transitで気に入った点として、アニメーションをメソッドチェーンで指定すると、 それを順に実行してくれるというアニメーションキューのような動きをしてくれる点がスゴく良いなと思いました。 具体的には、上記のサンプル集のような動きで、以下のような実装で実現出来ます。 $("#circle")
![[JavaScript] CSS3のTransitionを使ったアニメーションが簡単に実現できるJSライブラリ - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/5d3d4ee42fec71ca1b78f4c0f10859f6411bd280/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F165.jpg)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
