Webサイトのパフォーマンス改善を行うためにGPU処理を取り入れてみた — un-Tech
ごきげんよう。フーミンです。 最近のサイトはいたるところにアニメーションする要素が増えてきましたね。 制作ツールや学習環境が充実してきたことによって、実装が簡単になってきたことも要因の一つでしょうか。 実装が簡単になった分、 ｢アニメーション簡単で楽しい！どんどんアニメーションさせてイケてるサイト作るぜ〜！」 と、なにも考えずに何でもかんでもアニメーションさせていたら、 「なんか重いなぁ・・・動きもカクカクしてるなぁ・・・」 なんてことになったことありませんか？ 今回は、もっさり重くなってしまったサイトのパフォーマンスを改善するために、原因の追求と対策について、簡単に説明していこうと思います。 パフォーマンスの改善について まず、ひとことに「パフォーマンスの改善」といっても、 ネットワークパフォーマンスの改善（HTTPリクエストを減らす など） JavaScript & CSSパフォーマン
インストールするだけ! お手軽サイト高速化ツールGoogle mod_pagespeedはスゴかった | 初代編集長ブログ―安田英久
どれぐらいスゴいかというと、「サーバーにインストールするだけで、あとは設定ファイルをちょちょっといじれば、かなり高速化できちゃう」というぐらいスゴいのです。しかも、どんなサイトでも、どんなCMSを使っていても「インストールするだけ」。 Webサイトを高速化すると、ユーザーに優しいし、場合によっては検索結果での順位にも良い影響が出るかもしれない……それはわかっていても、なかなか本格的にサイトを高速化するのは難しいものです。 サーバー側の高速化に加えて、HTMLのつくりや画像のファイルサイズ最適化、さらにはCSSを調整しての画像スプライト化やCSS/JSファイルの結合・最適化によるブラウザとサーバーの通信本数削減などなど、実はやらなきゃいけないことがたくさん。 グーグルの提供するmod_pagespeedは、そうしたことの、かなりの部分を自動的に行うものです。 mod_pagespeedはこん
身につけておきたいWebサイト高速化テクニック #1｜アジェンダ編 | DevelopersIO
Webサイトの表示高速化対策していますか？ 日本は欧米諸国に比べWebサイトの表示高速化対策をしているサイトが少ないです。 特に、最近ではスマートフォンの普及によりモバイルサイトの需要も増え、高速化をしなければいけない機会も増えてるのかなと思います。 日本のモバイルデータ通信はLTEで高速になりつつあるとは言え、まだまだ「貧弱！貧弱ゥ！」です。 幸いなことに僕も最近鶴の一声によってクライアントからサーバー周りまで包括的な高速化対策を経験する機会を得ることができました。 それまでは、「手間がかかりすぎるからできればやりたくない」というのが本音でした。職務怠慢ですね（苦笑）。 でも、できるだけ楽したい！と思うのが人の常。 この連載ではできるだけ楽をしながらできる高速化手法と計測結果を1つ1つ紹介しようと思います。 基本的にはすべて受け売りの内容です。やってみた対策を羅列して、連載の中で自分で試
設計から実装まで、今すぐ始める高速化
1. 設計段階から実装まで、今すぐ始める高速化 設計段階から実装まで、今すぐ始める高速化 CSS Nite LP Disk 23 , こもりまさあき 2012. 06. 30 CSS Nite LP, Disk 23 | こもりまさあき 2. 設計段階から実装まで、今すぐ始める高速化 自己紹介を… こもりまさあき http://protean.im 1990年代前半に都内のDTP系デザイン会社にてアルバイトをはじめる。大 学卒業後そのまま正社員となり、入出力業務、デザイン業務、ネットワーク 関連業務に並行して従事。2001年、会社を退職しフリーランスの道へ。 案件ごとに業務内容や立ち位置が異なるため、職域的な肩書きはなし 近著に『レスポンシブ・ウェブデザイン標準ガイド（MdN刊）』 『WordPress 高速化＆スマート運用必携ガイド（共著・MdN刊）』、など Twitter: @ciph
JSX はなぜ「速い」のか - kazuhoのメモ置き場
なぜ「速い」のか、について JSX 開発者の立場から。 たとえば、シューティングゲームで一番重たい処理は何か。言うまでもなく衝突判定。多数の弾や敵機の衝突判定を毎フレームごとに行う必要があり、この演算が重たい。 JSX に同梱されている web/example/shooting.jsx には衝突判定のコードが複数あるが、一番重たいのは Bullet#update 関数で、その処理は以下のようになっている*1。 for (var rockKey in st.rocks) { var rock = st.rocks[rockKey]; if (this.detectCollision(rock)) { if (rock.hp == 0) return false; inDisplay = false; if (--rock.hp == 0) { st.score = Math.min(st.s
BeInteractive! [dispose() をいつ呼び出すのか？問題]
dispose() とか unload() とかってあるじゃん。そうそう、アレだよアレ。BitmapData とか Loader とかに用意されてる、破棄することを目的としたメソッドね。これをちゃんと呼ばないとメモリリークする—ってのは半分嘘で、実際には GC 対象になったうえで GC が発動すればきちんとメモリは開放されるんだけれども、GC が発動する頻度が高くないので巨大なリソースなんかを使った場合にはいつまでもメモリを占有し続けることがあって問題になる (たぶんね) —ので呼ばなきゃいけないんだけど、いつ呼べばいいの？って思ったこと無いですか？ いつってそりゃ、「不要になったら」ですよ。はい、この話はおしまい。…じゃなくてですね、意外とこの問題根が深い気がするんですけど、どう思いますか？というのも、「不要」ってどう判断するんでしょう？もう少し言うと、それを「誰が責任を持って」行うんで
Flash Playerのメモリ使用量を1/3に抑えるテクニック - OPTPiX Labs Blog
ウェブテクノロジ開発部の西田です。 この記事では、主にモバイル機器向けFlashコンテンツを開発されている方々に向けて、Flash Playerでのメモリ使用量とSWFファイルのファイルサイズを抑える方法についてご紹介します。 同時に、Flashコンテンツに画像を組み込む際の注意点についても紹介します。 現在、日本で普及しているほとんどのフィーチャーフォン（いわゆるガラケー）にはFlash Liteが搭載されており、Androidでも2.2以降からはFlashが搭載されています。ソーシャルゲームをはじめ、グラフィカルでリッチなFlashコンテンツが日々増えてきていますが、それにともないSWFファイルのファイルサイズやFlash Playerのメモリ使用量が問題になってくることがしばしばあるのではないでしょうか。 1. Flash Playerのメモリ使用量が1/3になる！ まずは同じくらい
パフォーマンスチューニングに関するアップルのドキュメント - その後のその後
アップルの『 iOSアプリケーションプログラミングガイド（英語版）』に、『パフォーマンスと応答性のチューニング』という章があって、これが今読むとかなり参考になったので、引用します。 個人的には、「リソースをあらかじめロードしておくと高速化になりそうだけど、メモリの無駄遣いになって結果的に遅くなるので絶対にやるな」というのが一番ささりました。 画像ファイルはUIImage化しておくと使うときに速そうだなーとか考えてたところだったので。 他にも個人的にためになった部分を太字にしてあります。 メインスレッドを妨害しない アプリケーションのメインスレッド上で実行する処理のタイプを必ず制限します。メインスレッドは、アプリケーションがタッチイベントやその他のユーザ入力を処理する場所です。 アプリケーションが常にユーザに応答することを保証するには、時間のかかるタスクの実行や際限なく続く可能性のあるタスク
イベントリスナ （AS3） とガーベジコレクション - akihiro kamijo
不要になったオブジェクトへの参照が残っていると、そのオブジェクトの使用しているメモリを開放することができません。特に複数の参照を持つオブジェクトに対しては、参照の消し忘れによるメモリリークが発生しないよう注意が必要です。 イベントリスナを登録すると、イベントのターゲットになるオブジェクトとイベントリスナを持つオブジェクトの間で参照ができます。AS3 では下のような記述になります。 eventTarget.addEventLisener("type", eventHandler); このコードを実行すると eventTarget と this の間に参照がつくられます。（eventHandler は this オブジェクトのメソッド） ところが、これは明示的な参照の追加ではありません。そのため、参照の削除が必要な場合でも見落としてしまいそうですよね。 というわけで、今回はイベントリスナ追加時
知らないと損するケータイFlash軽量化テク30連発！（1/3）- ＠IT
知らないと損する ケータイFlash軽量化テク30連発！ まだまだ健在のガラケーのSWFを1バイトでも軽くするには 株式会社サイバーエージェント 渡辺 梓 2011/7/20 スマホへの移行が増加しているという話題が多い中、まだまだ使われているFlash Liteコンテンツ。さまざまな機種でストレスフリーなアプリを制作するために最も気になる点はSWFファイルの軽量化と、実機での動作の軽さではないでしょうか。 本稿では、デザイン制作、Flashオーサリング、「Transform」を使ったSWF合成の3軸で、サクサクと動くFlash Liteコンテンツの作り方を説明します。 デザインから始める軽量化 スムースポイントを減らす 違いがほとんど分からないときは、コーナーポイントでも減らす グラデーションの代わりにブレンド 繰り返し使う形はインスタンス化 極力、アルファを使わない アウトラインに当た
そうだ、プログラミングしよう メモリ使用量をログに出す
Objective-CやCocoa touchのTIPSを書いていきます。目的はiOSアプリ開発です。 自分のアプリはiPhone/iPadでどれくらいのメモリを使っているのか調べたい。 Allocations を使えばメモリ使用量を調べることはできる。 ここでは、NSLogを使ってメモリ使用量を表示してみる。 #import <mach/mach.h> // これを import するのを忘れずに @interface MemoryInfo : NSObject { } + (struct task_basic_info)used; @end @implementationMemoryInfo + (struct task_basic_info)used{ struct task_basic_info basicInfo; mach_msg_type_number_t basicInfo
アプリのメモリ使用量をリアルタイムに表示するクラスを公開しました - Over&Out その後
なるべくUIViewを使わず描画するとか、nibを使わないとか、iOSアプリの動作を軽快にするためのTipsは数あれど、実際どれぐらい効果あるんだろう、ってことを調べたい、でもInstrumentsはめんどくさい、ってことでメモリ消費量やUIViewの数など、「負荷を示すパラメータ」をリアルタイム表示するクラスを作りました。 （イメージとしてはAS3でいうところのStats） 同梱のサンプルコードを実行すると、こんな感じで表示されます。（左上の黒いラベルがStats） パラメータ内訳は後述しますが、メモリを約16MB使用し、ビューが合計5つ（UIView、UIButton、UIButton上のUILabel、UIImageView、Stats）になっていることがわかります。 また、draw imageボタンを連打するとCPU負荷の値が若干上がることも確認できます。 ※シミュレータでの実行結
【iPhone】メモリ不足時のシミュレートとデバッグ | iphoneアプリで稼げるのか
iPachiで起きていた不具合なのですが、 特定の画面を表示中にメモリ不足に陥り didReceiveMemoryWarningを受け取ると アプリがクラッシュするという問題をついに 解消しました。 didReceiveMemoryWarning後にクラッシュするので メモリ管理でどこかがおかしくなっているのだろうとは 予想がつくのですが、いかんせん貧弱なエラーメッセージの ため、まったく発生元がつかめませんでした。 EXC_BAD_ACCESSとか言われてもさっぱりわからんです。 が、すばらしい記事をみつけました。 NSDebugEnabled これでクラッシュをおこしているオブジェクトの生成場所を 特定できるので、格段にデバッグ効率があがります。 というわけで、エミュレータでのメモリ不足時のシミュレートと デバッグのための設定をまとめます。 エミュレータでのメモリ
iPhoneアプリケーション開発: Objective-Cにおけるメモリ管理
メモリ管理の大まかな原則 C言語と共通の部分について、メモリ管理で気をつけることは特にありません。Cで気をつけることと共通です。 自分がmalloc()で確保したメモリは忘れずfree()で開放しましょうということだけです。従って、多くの場合に問題になるのはObjective-C固有の部分です。 Objective-Cのオブジェクトはretain countというものを持っています。生成すると0から1になります。 そのオブジェクトに関連付けられている変数名でretainをすれば、カウントが1増えます。 releaseをするとカウントが1減ります。run loopと呼ばれるシステムへの応答処理へ入った時、 このカウントが0になっているものはメモリ上から消えるようになっています。 autoreleaseとした場合には、適当と思われる部分で自動的に開放されるので、自分でreleaseを行う必要は
リファクタリング講座メモ - その後のその後
5/29にRainbowApps卒業生の方が主催された合宿に参加した際、そこでバスケさんが話されていた「公開リファクタリング講座」が非常にためになる内容だったので、そのときのメモを公開しておきます。 メモリまわりのデバッグ／リファクタリング leaksが有名なのでそればかり使いがちだが、memory allocationやzombiesでも見てみること live bytesが使用中のメモリ量 1.5Mぐらいなら画像使用してるアプリなら多くない 13Mになると、初代ipadなら落ちる可能性ある live bytesでソートすると、今一番メモリくってるオブジェクトタイプがわかる breakpointを右クリックでエディットできる アクションの設定・・・10回通った後で止まる、とか。 バンドルからplistを読み込む動作は重い（一時オブジェクトが生成されるのでメモリ空間も汚れる）ので基本的には1
PHPを使う上で、どう書けば高速になるか？をその場で試せるベンチマーク結果満載なサイト:phpspot開発日誌
PHPを使う上で、どう書けば高速になるか？をその場で試せるベンチマーク結果満載なサイト 2011年05月23日- Benchmarks PHPを使う上で、どう書けば高速になるか？をその場で試せるベンチマーク結果満載なサイトがあるようです。 同じことをやるのに複数の書き方があったりしますが、2つの書き方を並べてそれぞれどちらがどれだけかかったかという結果が記載されていて面白いです。 で、そのいくらかかったか？という秒数も、ページ上でリアルタイムに計算され、リロードすると実行され、実行タイムが表示されます。 サイトの作者環境による比較ではなく、その場で動いて何度も試せるので自分でその差を確認できるのがGood。 個人的には長年PHPをやっているのですが知らなかった物も多々あり、非常に勉強になりました。 1回のロードでは結果が変になることもあるので、サーバの負荷にならない程度に数回確認させてもら
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
NOW OR NEVER
1216彩票-官网平台
ソースコードの品質向上のための効果的で効率的なコードレビュー
実践・ウェブアプリ高速化テクニック#Chrome+HTML5 Conference