タグ

パフォーマンスに関するgayouのブックマーク (16)

  • SQLの実行計画の読み方 |

    今回は、SQLを書く上で特にパフォーマンスに影響のあるSQLの実行計画の読み方について解説します。実行計画はデータベース製品によってさまざまに差異がありますが、ここでは比較的どのデータベース製品でも共通する内容について解説します。 実行計画とは記述したSQLが実際にデータベースの内部でどのように処理されて結果を返すか、その処理方法を記述した情報です。 A5:SQL Mk-2では、SQLエディタで実行計画を見たい SQL の上にキャレットがある状態でメニューから [SQL(S)] – [SQLの実行計画(J)] または、Ctrl+E で表示できます。 表示の仕方はデータベース製品ごとに異なりますが、多くのデータベース製品ではツリー状の情報として表現されます。(このため A5:SQL Mk-2でもツリービューで実行計画を表示します。) ツリーのリーフ(端)から処理が行われ、ルート(根)に向かっ

  • Cakephp2系が激重だったので、色々やったらクソ速くなった | Into The World

    CakephpWebサービスを作っているのですが、最初の頃は速かったのに いつの日か気づいた時には、激重になっていました。 Google Speed Insightでチェックすると、 ○ トップページ モバイル 66点 PC 70点 ○ シングルページ: モバイル 47点 PC 69 そこまで悪い数字ではない(特にPC)けれど、体感でのスピードは激重。 5,6秒くらいかかってる気がする。これじゃユーザーすぐ離脱するぜ。。。 ということで、Cakephpのパフォーマンス向上施策をしました。 先に結果から書いておくと、 Mysqlのクエリ発行回数が多すぎた。 でした。 – ムダにDBにクエリ投げないこと – DBにindexをきちんと 結果的には、mysqlのクエリが多すぎた事が一番大きな原因でした。 僕の場合footerに沢山の情報を表示するためにAppControllerで大量にfind

    Cakephp2系が激重だったので、色々やったらクソ速くなった | Into The World
    gayou
    gayou 2016/03/30
    振り返り大事。
  • 第4回 Webの「Load(読込み)」を改善しよう(後篇) | gihyo.jp

    はじめに Webページの読込パフォーマンスについて、前回、単純なWebページの読込時間(PLT)から、その過程を含めた評価方法(Speed Index⁠)⁠、コンテンツのメインとなる巨大な画像リソース(Hero Image)といった、さまざまなメトリクスについて紹介しました。Webページ読込のパフォーマンスは、JSやCSS、画像などのリソースが互いに干渉しあい、ブロッキングを起こすことで劣化するのです。 後篇では、Webが扱うリソースをより低いレイヤーから考えてみましょう。前篇はあくまでHTMLというレベルでの制約(ブロッキング)と最適化の話でしたが、記事ではHTTP以下の制約とその最適化に目を向けます。その対策は、通信時に使われるTCPコネクションをいかに効率化するのかという点と、キャッシュをいかに有効活用するのかという点の、2つの観点から整理できます。 TCPコネクションの有効活用

    第4回 Webの「Load(読込み)」を改善しよう(後篇) | gihyo.jp
  • 楽しく役に立つCSSのプロファイリング | POSTD

    私はここ最近、いわゆるシングルページWebアプリケーションのパフォーマンスの最適化に取り組んでいます。そのアプリケーションは非常に動的かつインタラクティブで、新しいCSS3の利点が詰め込まれたものです。単に角丸やグラデーションの効果にとどまらず、影やグラデーション、要素の変形がふんだんに使われており、加えてtransition効果(時間的変化)や多彩な半透明色、疑似要素をベースにしたCSSの巧妙なトリック、それに実験的なCSSの特徴がちりばめられています。 分析する際には、Javascript/DOM側のボトルネックだけではなく、CSSの領域にも踏み込んでみました。上に挙げたすばらしいUIの要素が、パフォーマンスにどのような影響を及ぼしているかを見たかったからです。このアプリケーションのベースにあるJavascriptのロジックは以前(表面的な装飾のないバージョン)からさほど変わってはいま

    楽しく役に立つCSSのプロファイリング | POSTD
  • HTML5 Experts.jpはなぜこんなにパフォーマンスが悪いのか…全てお見せします!ーWebパフォーマンス改善企画(改善編)

    HTML5 Experts.jpはなぜこんなにパフォーマンスが悪いのか…全てお見せします!ーWebパフォーマンス改善企画(改善編) 吉川 徹 Webパフォーマンス改善企画(改善編)は、実際の改善内容とその結果をお伝えします!パフォーマンス分析を行った解析編は、こちらからご覧ください。記事はHTML5 Experts.jpがいかにして速くなったのかを包み隠さずお伝えします! 今回の前提条件と改善ポイント 実際の改善を行う前にいくつか前提条件を説明しなければいけません。まず動作環境ですが、HTML5 Experts.jpは、WordPress上で動作しており、改善内容はプラグインの導入やPHPのコード修正が主になっています。ただ、そういったWordPressの泥臭いチューニングは題ではないので、細かく解説するのではなく大まかな改善内容とその方針を説明したいと思います。また、改善内容に関して

    HTML5 Experts.jpはなぜこんなにパフォーマンスが悪いのか…全てお見せします!ーWebパフォーマンス改善企画(改善編)
  • よく考慮したコーディングとパフォーマンスの関係 - ワザノバ | wazanova

    http://hacksoflife.blogspot.com.au/2015/01/the-four-horsemen-of-performance.html 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約4時間前 Benjamin Supnik曰く、高いパフォーマンスをだせるソフトウェアは、高いパフォーマンスを目指したデザインプロセスが大切。「当にひどい状態になったら、プロファイラで調べて直すから。」といっても色々積み重なると簡単には直せなくなると指摘しています。そして、ゲーム開発において遅いコードを生み出すパターンを挙げてくれてます。 1. 無駄なことをする テーブルを再描画する際、ユーザが見える部分だけでなく、テーブル全体のデータを取得していないか? 同じ値が計算されて何度も使われるケースで、都度計

  • HTML5 CONFERENCE パフォーマンス部パネルディスカッション 「2015年これからの日本のWebサイトパフォーマンスについて」

    HTML5 CONFERENCE パフォーマンス部パネルディスカッション 「2015年これからの日のWebサイトパフォーマンスについて」

    HTML5 CONFERENCE パフォーマンス部パネルディスカッション 「2015年これからの日本のWebサイトパフォーマンスについて」
  • Re-think about Web Performance

    2014/6/21に開催されたFrontrend in NagoyaのRe-think about Web Performanceのセッションの資料です。

    Re-think about Web Performance
  • html5j パフォーマンス部 Webサイト

    この部活について 何故、Webサイトはパフォーマンスが求められるのか? どれだけ素晴らしいデザインであっても、どれだけ便利なサービスを提供していても、そのWebサイト自体がキビキビと高速に動作しないのであれば、ユーザはストレスを感じて、アクセスしなくなるでしょう。 Webサイトとは、鑑賞するためのものではなく、何かしらの「体験」を提供する工業品としてのソフトウェアであり、Webデザインは美術的な美ではなく、機能的な美が求められます。その意味において、Webデザインとは、工業デザインであり、その中でも「速度」という要素は重要な設計要素の一つです。 人の脳の質として、常に処理すべき刺激を求めるが故に、思考を停止させることは苦痛であり、人は「待たされること」を嫌います。ですから、Webサイトに限らず、人は遅いものが嫌いです。 待つことが苦痛であるが故に、待つことで価値が上がっていくものもありま

  • モバイルブラウザでもサクサクに動作する最適化6つのノウハウ

    「Webサイト・アプリ高速化テクニック徹底解説」第8回は、モバイルブラウザに向けた最適化について紹介します。 モバイル端末はPCに比べ、CPUやネットワークなどの性能面で劣ることからボトルネックの影響が出やすく、またゲーム開発など突き詰めたチューニングを行う場面では、特殊なノウハウも必要になります。 しかしきちんと最適化を行えば、その効果もその分著しく、比較的低スペックな端末や3G回線であっても、サクサク軽量なサービス提供が可能です。今回の記事では、その勘所をお伝えしたいと思います。 1. ボトルネックを取り除く まずはやってしまいがちなボトルネックの事例について、挙げていきたいと思います。前述のようにモバイル端末では、その性能からPCよりも顕著に、未最適化箇所が体感に影響を及ぼします。 仕事がらそこそこの数のアプリケーションを見てきましたが、モバイル向けに特化したチューニングができていな

    モバイルブラウザでもサクサクに動作する最適化6つのノウハウ
  • High Performance Web Frontend 2013 秋

    第15回リクリセミナー「Frontrend in Osaka」 - Re:Creator's Kansai http://recreators.doorkeeper.jp/events/5240 で利用したスライドです。編60分でした。 同年の7月に行ったWCAN Summer 2013の講演とは、Network周りの前振りを厚くしたり、Compute周りをより薄くしたりと、構成の配分に調整が加えられています。

    High Performance Web Frontend 2013 秋
  • HTTPリクエストを減らすために【序章】HTTPリクエストは甘え - MOL

    このシリーズはHTTPリクエストの理解を通じてWebパフォーマンスの重要性について考える5章構成になっている。 【序章】HTTPリクエストは甘え 【CSS Sprite編】スプライト地獄からの解放 【WebFont編】ドラッグ&ドロップしてコマンド叩いてウェーイ 【DataURI編】遅延ロードでレンダリングブロックを回避 【終章】我々には1000msの猶予しか残されていない 1日目は、HTTPリクエストの概要について説明する。 例えに、私のポートフォリオページ(t32k.me)が表示されるまでの流れを見ていく。まず、検索からでも方法はなんでもよいが、ブラウザのURLバーにt32k.meと打ち込んでアクセスする。そのページを見にいくということは、つまりt32k.meに対してHTTPスキームでリクエストするということを意味している。 クライアントであるブラウザは入力されたURLを判断して、リソ

  • スマホ用サイトの読み込み速度を改善し、1秒以内の表示を目指そう

    携帯端末向けページのレンダリングを高速化するためのガイドラインができたことを紹介する内容です。ガイドラインは英語ですがなかなか勉強になります。 日語版は準備中だそうです。 最初に見える部分は1秒以内に表示する ここでは1秒以内にページ(スクロールなしで表示される部分)を見ることができる状態にすることが重要だといわれています。1秒を超えると我慢できなくなり離脱する人が増えるようです。1秒で諦めるのもちょっと短気な気もしますが、読込みは早いに越したことはないですね。 まず、3G環境では一般的にDNSルックアップ、TCP接続、HTTPリクエストにそれぞれ0.2秒かかるそうです。この辺のことはあまり詳しくないですが、とにかくこれらにかかる計0.6秒はこちらでどうしようもありません。 ですので1秒で表示しようと思うと残り0.4秒しかありません。ということで、サーバーのレスポンスとユーザー側のレンダ

    スマホ用サイトの読み込み速度を改善し、1秒以内の表示を目指そう
  • スマートフォンサイトを驚くほど速くする!高速化9つのポイント | Find Job ! Startup

    回線が細くCPUも弱いスマートフォンは、リッチなWebサイト表示が苦手です。しかし、地道な対策で表示速度が驚くほど変化するのも事実。 今回はスマホのWebサイト表示の高速化手法をまとめました。もちろんPC向けにも効果バツグンのTips集です。 Webサイトを劇的に高速化する9つのポイント 1.画像を圧縮する 2.画像はサイズを指定して使う 3.画像は適切なサイズで使う 4.CSS/JavaScriptを圧縮する 5.CSSスプライトを使う 6.不要なCSS/JavaScriptを読み込まない 7.CSS/JavaScriptをまとめる 8.CSSセレクターを最適化する 9.mod_deflateでgzip圧縮する 1.画像を圧縮する 画像を最適化することは、フロントエンドの高速化に絶大な効果を発揮します。Photoshopを使って圧縮しても良いのですが、もっと手軽に圧縮

  • 身につけておきたいWebサイト高速化テクニック #1|アジェンダ編 | DevelopersIO

    Webサイトの表示高速化対策していますか? 日は欧米諸国に比べWebサイトの表示高速化対策をしているサイトが少ないです。 特に、最近ではスマートフォンの普及によりモバイルサイトの需要も増え、高速化をしなければいけない機会も増えてるのかなと思います。 日のモバイルデータ通信はLTEで高速になりつつあるとは言え、まだまだ「貧弱!貧弱ゥ!」です。 幸いなことに僕も最近鶴の一声によってクライアントからサーバー周りまで包括的な高速化対策を経験する機会を得ることができました。 それまでは、「手間がかかりすぎるからできればやりたくない」というのが音でした。職務怠慢ですね(苦笑)。 でも、できるだけ楽したい!と思うのが人の常。 この連載ではできるだけ楽をしながらできる高速化手法と計測結果を1つ1つ紹介しようと思います。 基的にはすべて受け売りの内容です。やってみた対策を羅列して、連載の中で自分で試

    身につけておきたいWebサイト高速化テクニック #1|アジェンダ編 | DevelopersIO
  • Webアプリケーションを高速化する50のトリック

    MicrosoftのInternet Explorer PMであるJatinder Mann氏は、BUILD 2012でHTML5アプリとサイトを高速化する50のパフォーマンストリックというセッションで、Webアプリケーションを高速化する多くのチップスを提供した。 Mann氏が提供したアドバイスは、以下の6つの原則を中心に構成されていた。 1. ネットワークリクエストに迅速に応答する リダイレクトを避ける。上位1,000のWebサイトのうち63%は、リダイレクトを使用している。これらはリダイレクトをやめることによって10%のパフォーマンスを改善することができる。 メタリフレッシュを避ける。世界のURLのうち14%は、メタリフレッシュを使っている。 可能な限りユーザーの近くにあるCDNを使用してサーバーの応答時間を最小化する。 異なるドメインからのリソースをダウンロードすることによって、同時

    Webアプリケーションを高速化する50のトリック
  • 1