ユーザーの体感速度を高めるためのJavaScriptチューニング（前編）
連載「Webサイト・アプリ高速化テクニック徹底解説」第2回は、JavaScriptの高速化について、まずは前編、後編に渡ってユーザーの体感速度を向上させるための方法を紹介します。JavaScriptの同期・非同期の仕組みやscript要素のasync属性、defer属性について詳しく解説します。 今回から複数回に分けて、JavaScriptの高速化をテーマに解説していきます。まずは、ユーザーの体感速度を高めるためのJavaScriptチューニングということで、単純なJavaScriptの構文によるスピードを比較するようなものではなく、主にユーザー視点からの高速化を主眼に解説します。その中で、同期・非同期といったJavaScriptの仕組みやscript要素のasync属性、defer属性などについても触れていきます。 ユーザーの体感速度を向上させる 一概にJavaScriptの高速化といっ
ScaleOut | Supership
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
アプリエンジニア向け：「サーバがなんか重い」時にすること - Qiita
アプリケーションエンジニアの人には「なんか重い」という状況に遭遇したらインフラの人にタスクを投げる、という人もいるかも知れません。けど、その重さのどこに原因があるのか。CPUか、ネットワークか、IOかくらいの診断はできた方がアプリ開発においても有益です。 「せっかくつくったシステムがなんか重い」 そんな時にアプリケーションエンジニアとしてできることを書きます。 本職のインフラの人にはぬるい内容だと思います。何を隠そう僕自身がアプリ寄りの人間なので、突っ込んだ話はできないのです。あしからずご了承ください。 なんかサーバが重いなー まずはロードアベレージを調べる サーバが重いと思ったら、まず真っ先にすべきことは対象ホストにSSH接続してロードアベレージを調べることでしょう。ロードアベレージとは 実行されずに待たされているプロセスの数 のことで、多すぎるとやばいと認識しておきましょう。ロードアベ
「全自動パラメータチューニングさん」は何であって何でないのか - 昼メシ物語
発表資料: 全自動パラメータチューニングさん // Speaker Deck ソースコード: https://github.com/mirakui/tuningsan これは何なのか ハッカソンイベント「Open Hack Day Japan」にて、24時間の制限の中で開発し、90秒でプレゼンテーションした作品です 2013/2/16〜2/18 にかけてヤフー株式会社で開催された、「Open Hack Day Japan」という大規模ハッカッソンイベントで開発しました。 上記のプレゼンテーションは発表で使用したものです。 Open Hack Day Japan - Yahoo! JAPAN 本作品は、全参加作品の中で唯一のコマンドラインツールであり非常に地味でしたが、ありがたいことに KLab賞をいただくことができました。どうもありがとうございます。 指定した1パラメータの自動調整によって
さくらのVPS 1G+WordPressで1日5万PVを捌く構成メモ - はげあたま.org
はじめに ここ数日でブログに少し手を入れたので、現時点の備忘録です。内容的には半年前に四苦八苦した部分がほとんどですが、超オーソドックス設定なので、まとめておいて損はないでしょう。 なお、うちでは1日5万PV以上が出なくてテストできないだけで、たぶんもう少しは捌けます。 事の起こりは一年前。ブログを一新する際に日和ってWordPressを選択したのですが、計算してみるとピークに3PV/秒越えると発狂する計算に。あれ？ まがりなりにもVPSをほぼ丸々割り当ててるので、個人レベルのブログなら鼻歌交じりに処理できるとか思ってたんですが、PHPのメモリの喰い方とApacheのデフォルト設定のアホさを嘗めていました。 その後、いろいろとありながらも安定運用には到達したので、何かあった時に再現出来るように書き残しておきます。 環境：さくらのVPS 1Gプラン Debian squeeze + Apac
xhprofの読み方 - でつmblr
最近xhprof使い始めたのですがインストールまではよく紹介されてたのですが、数値の意味まで解説してなかったので簡単にまとめます。 installsudo pecl install xhprof-beta peclでインストールする場合、まだベータ版しかないのでパッケージ名の後ろに"-beta"を付ける必要があります。 動作までは解説されてる記事がよくあるのでそちらを参考に PHPのプロファイラー「XHProf」の使い方 PHPプロファイラー XHProf プロファイル画面 表の項目について FunctionName コールされた関数名Calls コールされた回数Calls% 全体のコール回数に対する割合Incl. Wall Time その関数全体の処理時間IWall% 全体の実行時間に対する割合Excl. Wall Time その関数から呼ばれた関数の実行時間を除外した、関数の純粋な処理
［1］画面表示に10秒もかかる
大規模サイトの性能改善作業とは、どういうものなのか。リクルートの中古車情報サイト「カーセンサーnet」を全面リニューアルした体験を基に、その実態をレポートする。新システムはオープン2カ月前の時点で、目標性能に遠く及ばないことが判明。最終的に、Linuxカーネルのある処理方式が性能劣化の原因だと分かった。 「ブラウザーの表示に10秒もかかる。処理できるアクセス件数も全然足りない。これでは話にならない」――。 2010年夏。中古車情報サイト「カーセンサーnet」の全面リニューアルで、性能検証を担当していた私はあぜんとした。リニューアルオープンを間近に控えながら、新システムの性能が遅すぎることが判明したのだ。 そこから私の2カ月にわたる苦闘が始まった。検証作業は連日深夜まで続き、性能試験の実施回数は約100回に及んだ。その中で、性能が出ない理由が一つひとつ判明していった。ファイル共有システム「N
大規模ソーシャルゲーム「ドラゴンコレクション」運営の最前線で得られたノウハウ ～チューニングと運用、18のポイント～
11月25日、「mobidec 2011」においてコナミデジタルエンタテインメントのスタジオITセンター長である正延光弘氏によるセッション「大ヒットSNSゲーム『ドラゴンコレクション』を支えるコナミのクラウド技術の活用」が行われました。 ドラゴンコレクションは、GREEで提供されている携帯電話向けのカードゲームタイプのRPG。プレイヤーは、エリアごとにある複数のクエストをクリアしていき、モンスターカードや「秘宝」を手に入れ、さらに「ドラゴンカード」を集めていきます。また、ほかのプレイヤーとバトルすることでも秘宝を入手できるというSNS要素も取り入れられていました。2010年9月のサービス開始後、順調にプレイヤー数を伸ばし、現在では登録人数が500万人を超えています。 サービス開始当初は社内でサーバを構築し、フロントエンドに6台のサーバ、バックエンドに3台のデータベースサーバ、そしてロードバ
SHOW FULL PROCESSLIST を使った MySQL のプロファイリング : DSAS開発者の部屋
KLab Advent Calendar 2011 「DSAS for Social を支える技術」の3日目は、 引き続き MySQL 周りのチューニングノウハウとして、すぐに役立つ プロファイリング方法を紹介します。 DBサーバーの負荷が高い時、 slow_log を見て問題になっている重いクエリを 発見するのが一般的かもしれませんが、 slow_log に一切ログが残らないのに 負荷が高い状況や、むしろ負荷が高すぎてごく一般的でどう考えても遅いはずが ないクエリ ("SET NAMES utf8" や "BEGIN") すら slow_log に大量に乗ってしまう場合が あります。 slow_log 以外で問題になっているクエリを見つける方法として、 "SHOW FULL PROCESSLIST" コマンドがあります。これを数回〜数十回叩いてみて、 よく出ているクエリは、遅かったり量が
hamano's gist: 第2回 Tuningathon チューニングメモ
tuningathon2_memo.txt �ف��U #���U # 第2回 Tuningathon チューニングメモ このメモは @hamano が [第2回 Tuningathon][1] に参加した際に行ったチュー ニングポイントと感想です。 [1]: http://www.zusaar.com/event/agZ6dXNhYXJyDQsSBUV2ZW50GLmFBgw "第2弾！いろいろチューニングしてパフォーマンスを競うバトルイベント開催！「Tuningathon」2!! #tuningathon" 今回のお題は MediaWiki への参照性能という事でまたPHPか! とは思いました が2台構成可、Web Serverの入れ替え可、という条件でしたのでチューニングの 範囲が大きく広がった様に感じました。 ただ、この程度の平行数ではapacheをその他実装に置き換えた所で大した
チューニンガソン2で2位でした : DSAS開発者の部屋
10/1(土)にチューニンガソン2 というイベントに参加してきました。 もちろん前回に引き続き優勝を 目指していたのですが、今回は残念ながら2位でした。 今回もどんなチューニングをしていたのかの記録を公開します。 （ちなみに優勝したのは元KLabの濱野さんで、同じく メモを公開されています。） 今回のチューニンガソンのお題は、 Wikipedia の高速化で、 MediaWiki と Wikipedia の データが入った MySQL のデータには修正を加えずに、ランダムな100ページの表示速度を競いました。 マシンはメモリ1GBでデュアルコアのものが2台で、今回はWebサーバーの部分は自由に構成できます。 1. ボトルネックの確認 とりあえず AMI Linux の標準の php + apc で計測したところ、1ページの表示に1秒くらい使っています。 またphpか！ということで、やっぱり
例えば GC を止める・Ruby ウェブアプリケーションの高速化 - 2nd life (移転しました)
最近クックパッドでは、アプリケーションサーバの大半が Rails 2.3 から Rails 3 に置き換わったのですが*1、リリース前のベンチマークの時点ではあまりパフォーマンスが出ず四苦八苦していました。具体的には Rails 2.3 の時と比べ MRI 1.8.7 だとレスポンスタムが200%ぐらい遅い結果でした。Rails 3 になって実装が Merb core を取り入れ疎結合で綺麗になった反面、より多くのオブジェクトと・メモリを利用する様になった影響かと思います。 そこで Ruby インタプリタの変更*2を行い検証をしたところ MRI 1.8.7 (Rails 2.3と比べ) 約200%遅い MRI 1.8.7 -> Ruby Enterprise Edition 1.8.7 2011.03 (tcmalloc 無効) 約180%低速 MRI 1.8.7 -> Ruby Ente
さくらVPSのWordPressをチューニングして30倍高速化した方法 - 原宿・表参道.jp
今日はさくらVPSに載せているWordPressのパフォーマンスをチューニングして高速化に成功したので安心して眠れるという話をします。 2.5ページ/秒だったのが70ページ/秒と30倍高速化。 以前はDaily数千PVで重くなっていたサイトがDaily3.6万PVを余裕で捌けるようになりました。 #ちなみにproxy cacheという手法はwordpressでなくても動的コンテンツ全般に有効です。 ▼サーバ気にしなくて良くなったので今週末新宿御苑に花見に行けました☆。枝ぶりがいいさくらが多くてほんといいところだと思うの。 WordPressチューニング高速化結果http://hara19.jp/のサーバ環境と測定結果は以下のとおり。 WordPress稼働環境さくらVPS 1GB/CentOS5.5/PHP5.3/MySQL5.5/WordPress3.1。 WEBサーバはチューニングにあ
JavaScriptが遅い4つの原因とは？
1つ前の記事「JavaScriptをいかに高速化するか、IE9、Firefoxの取り組み」では、IE9とFirefoxにおけるJavaScriptの高速化について紹介しましたが、そもそもJavaScriptの実行速度はなぜ遅いのでしょう？ その理由について、Mozilla Japanテクニカルマーケティング担当の浅井智也氏が、スライド「Trace Monkey」でポイントをまとめています（このスライドはタイトルから分かるとおり、Firefoxの当時の新しいJavaScriptエンジン「Trace Monkey」を紹介するために1年以上前に作成されたスライドですが、1つ前の記事を見ると、ここで示された課題はいまも変わっていないようです）。 全67枚のスライドの20枚目から24枚目の5枚を以下に紹介します。 JavaScriptが遅い原因は、以下の4点にまとめられています。 インタープリタ型言
高負荷サイトのボトルネックを見つけるには : DSAS開発者の部屋
はじめに アクセスが急増すると、応答時間が著しく悪化するサイトはありませんか？ 普段は200ミリ秒以内で安定してアクセスをさばいているのに、イベントやらキャンペーンやらを開始した瞬間から、普段の２倍や３倍のアクセスが殺到し、その結果、レスポンスタイムが3秒とか9秒とかかかるようになってしまうことってありますよね。 あるサイトの実状 つい先日まで、そんなサイトが私の目の前にもありました。自社で運営している某ソーシャル系のサイトなんですが、イベント開始時刻と同時にアクセス数が急増するのです。とはいえ、所詮は普段の2倍とか3倍程度の数なのだから、少なくとも1秒以内にレスポンスを返せるくらいの性能は維持したいものです。 しかし実際は困ったことに、応答に3秒以上もかかってしまう処理が大量に発生してしまう状況に陥ってしまっていました。これはきっと、どこかにボトルネックがあるに違いありません。 仮説を立
チューニンガソンで優勝してきました : DSAS開発者の部屋
7/9(土)にチューニンガソン というイベントに参加して優勝してきたので、その報告と、何を考えてどんなチューニングをしたのかを 記憶の範囲で公開したいと思います。 今回のチューニンガソンのお題は、WordPress(ja) + php + Apache + MySQL で、 ab を使って wp-comment.php 経由でコメントのポストをすることで計測が行われました。 MySQLとApacheを立ち上げたらWordPressが動く環境が渡され、そのWordPress自体は設定ファイルを含めて 改造が一切禁止、WordPressの実行をショートカットするチートも禁止です。 0. 試合前日 環境がAWSとAMI Linuxということは事前に公開されていたため、前日にAWSに登録して少しだけAMI Linuxを 触ってみました。yumベースだけどCentOSと違って結構新しいバージョンが用
ソーシャルゲームのためのMySQL入門その２ | BLOG - DeNA Engineering
こんにちはこんにちは。11インチMacBook Airが欲しくてたまらないiwanagaです。 前回の記事 が幸いにもご好評を頂けた様で非常にうれしいです。嬉しくなって、ついがんばって第２弾を書いてしまいました。引き続き、ソーシャルゲームでよく使われるテーブルタイプ毎にちょっとしたテクニックを紹介していきます。 今回はちょっとライトな感じ＆読み物になってしまっていますが「ユーザID単位で1つだけ持つデータ」と「パラメータなどのマスターデータ」についてご説明したいと思います。ちなみに次回はInnoDBのデータ構造の簡単な説明と複合プライマリーキーのデータについて、その次で紹介し損ねたちょっとマニアックなテクニックや性能管理のための手法を紹介することを予定しています。 その前に。。。 先日行われた JAPAN INNOVATION LEADERS SUMMIT で弊社松信が「ソーシャルゲームの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
実践・ウェブアプリ高速化テクニック#Chrome+HTML5 Conference
PHPでの大規模ゲーム開発事例〜『ブラウザ三国志』【本日のスライド】 / GameBusiness.jp
ソーシャルゲームのためのデータベース設計
