はてなブログのキャッシュ周りをきちんと改善したら、アプリケーションサーバの台数を半分にできた話 - Hatena Developer Blog
はてなブログでSREをやっているid:cohalzです。 2019年12月頃からid:utgwkkやid:onkとともに、はてなブログにおけるキャッシュ周りの改善を行いました。その結果、次のような成果が得られました。 ブログ記事のキャッシュヒット率が、1日平均で8％から58％に向上 アプリケーションサーバの台数を、以前の半数以下に削減 DBに届くリクエスト数が、以前の3分の2まで減少 レスポンスタイムの平均が、以前の8割まで減少 この記事では、実際にどういった改善を行ったのか、その際に気をつけたことや大変だったことを紹介します。 はてなブログがVarnishを導入した経緯と課題 開発合宿をきっかけに問題が明らかになる 進め方をまず考える ホストのメモリをできるだけたくさん利用する メモリを積んだホストでなぜかレイテンシが悪化 キャッシュが分散しないようVaryヘッダを使う デバイス情報を適
ページ上でずっと動いているsetTimeout、setInterval、requestAnimationFrameを見つけてパフォーマンス改善する
ページ上でずっと動いているsetTimeout、setInterval、requestAnimationFrameを見つけてパフォーマンス改善する 複雑なウェブアプリケーションになってくると、1つのページで複数のTimerなどを回すことがあります。 例えば、Twitterのようなアプリならば、ポーリングで更新するためにsetInvervalのようなタイマーを回します。 また、ゲームなどCanvasで描画を行うアプリケーションならば、メインループをrequestAnimationFrameで回します。 このように色々なタイマー系がありますが、アプリが多機能になっていくと色々なタイマーが同時に動くようになっていきます。 特に問題がなりやすいのが表示中だけタイマーを回すコンポーネントです。 よくあるのが次のようなmount時にtimerを開始して、unmount時にtimerを停止するコンポーネ
なぜ dev.to がこんなにも速く、こんなにも自分にとって感動的なのか
最初にいっておく。これは負け惜しみだ。 SPAとPWAの現状 自分は日本でReactの勝手エヴァンジェリストみたいなことをやっていて、SPAの重めのコンテンツをよく作ってるからか、「お前らフロントエンドを物事をややこしくして、重いページを量産してウェブを劣化させてるじゃないか！」みたいな批判を、名指しでよく受ける。なんで僕にいうかわからないけど、React = SPA みたいなイメージでスケープゴートにされてるんだろう。それはまあいい。 自分の仕事でSPA技術を使うところは、ちゃんと必要性もあるし理由も説明できる。ただ、やはり近年の複雑化/重量化について思うところはあるので、逆に振って AMP/PWA という選択肢を持っておきたくて、正直言うと依頼されたR&Dの仕事でもあったんだけど、一通り覚えた。なんだけど、今のところ仕事で使うタイミングがない。 PWA技術を仕事で使えなかった理由として
「爆速すぎて笑う」 表示速度が“異常な”Webサイト「dev.to」 その仕組みは
「爆速すぎて笑う」「速すぎて逆に不安になるレベル」――「dev.to」という米国のWebサイトの表示速度が異常に速いと、ネット上で話題だ。なぜ速いのか、サイト創設者のベン・ハルパーンさんがサイト内の記事で説明している。 2016年にオープンしたdev.toは、プログラマーが情報を交換したり、議論したりできるコミュニティーサイト。トップページにはユーザーが投稿したブログ記事のタイトルやコメントが、SNSのタイムラインのように並んでいる。このトップページの表示にかかる時間、各記事をクリックしたときのページ遷移が“一瞬”なのだ。 なぜ速いのか。ハルパーンさんが17年2月に投稿したブログ記事によれば、米Fastlyが提供するCDN（Content Delivery Network）を活用している。CDNは世界中にキャッシュサーバを分散配置し、ユーザーごとに最も（ネットワーク的に）近いサーバにキャッ
dev.toと阿部寛のホームページどっちが速いですか？ - くうと徒然なるままに
dev.toと阿部寛のホームページどっちが速いですか？— あれからのぐりだけど (@_guri3) 2017年11月15日 という内容のツイートを見つけたので計測してみる。 ずっとパソコンに向かってて飽きてたので息抜きで。 dev.to というのは、 Qiita の海外版みたなやつです。一番の特徴はナビゲーションの速さ。 対抗するのは、 THE Traditional Web Site というたたずまいで有名？な 阿部寛のホームページ 計測 今回は、Google の PageSpeed Insights を利用していきます。 dev.to まずは、dev.to から 86/100 です！ 阿部 寛 のホームページ 92/100 です！ まとめ 伝統的ウェブサイトの方が早かった！
ウェブページを1秒台で表示させる原理と方法 | Philosophy Guides
可能な限り最新の情報を反映していますが、追いつけていないこともあります。本サイトに採用していても、記事に反映できていない設定もあります。ページのソースを読んでいただくと、参考になる箇所があるかもしれません。 ウェブページの高速化に関するテクニックは、ネットで検索すれば簡単に見つけることができます。優れた情報も数多くありますが、｢CSSとJavaScriptはminify（ミニファイ）しておけばOK！」のような都市伝説も少なくありません。 そこで、ここでは本サイトのデザインリニューアル時に施した対策をもとに、一歩進んだウェブページの高速化の方法と、それを支える原理について、できる限り分かりやすく説明したいと思います。フロントエンジニアやデザイナーの方からすれば「んなもん知っとるわ！」な情報なのかもしれませんが、都市伝説を駆逐すべく、私なりの仕方で解説（≒加勢）したいと思います。 初めに結果を
なぜ、SQLは重たくなるのか？──『SQLパフォーマンス詳解』の翻訳者が教える原因と対策 - エンジニアHub｜Webエンジニアのキャリアを考える！
なぜ、SQLは重たくなるのか？──『SQLパフォーマンス詳解』の翻訳者が教える原因と対策 『SQLパフォーマンス詳解』の翻訳者の松浦隼人さんに、8つの「SQLが重たくなる原因とその対策」を聞きました。システムのボトルネックになるような「問題のあるSQL」を回避するノウハウを学びましょう。 データの操作や定義をする言語「SQL」は、どのような領域を担うエンジニアにとっても必修科目です。しかし、その仕様をきちんと理解し、パフォーマンスに優れたSQLを書ける方はそれほど多くありません。問題のあるSQLを書いてしまい、知らぬ間にそれがシステムのボトルネックになってしまう事態はよく発生します。 では、どうすればそうした事態を回避できるのでしょうか？ そのノウハウを学ぶため、今回は『SQLパフォーマンス詳解』の翻訳者であり、自身もエンジニアでもある松浦隼人（まつうら・はやと／@dblmkt）さんに8つ
Perlが30倍速くなるかもしれないSPVMの開発版をリリースしました。 - Perl入門ゼミ
Perlが30倍速くなるかもしれないSPVMの開発版をリリースしました。 SPVM(CPAN) かもしれないと書いたのはベンチマークをまだとってないからで、理論的にはJava VMの速度まで、近づけることができるんじゃないかなと思うから。 開発版なので、まだ機能が足りないのだけれど、CPANにリリースして、CentOS, FreeBSD, Windowsで動かすところまでやったので、ここで公開します。Macを持っていないので、Macの方は、CPANからインストールできるか確認していただけるとありがたいです。 SPVMはPerlに似た新しいプログラミング言語で、バーチャルマシン上で動き、関数をPerlから簡単に呼び出すことができる。 完全な静的型を持ち、Javaと同じデータ型、byte, short, int, long, float, doubleを持つ モジュールを書いてすぐに実行できる
Photoshopの動作を軽快にするための10のポイント
Photoshopの設定を変更して、動作を軽快にするための10のステップをSmashing Magazineから紹介します。 10 Simple Steps to Better Photoshop Performance はじめに もし、あなたがPhotoshopの設定をデフォルトのまま使用していたり、パフォーマンスを改善するために再点検することを望むなら、ここで紹介する10のポイントをチェックしてみてください。 1. ヒストリーの数を調整 作業履歴を記録するヒストリーはRAMを肥大化させるため、できるだけ数を少なく設定します。 一つの目安として、RAMが2GB以下の場合はヒストリーを使用しない方が軽快に動作します。 [編集] - [環境設定] - [パフォーマンス]の「ヒストリー&キャッシュ」で設定を変更できます。 2. キャッシュレベルの数を調整 レイヤーの数が少なく高精細の画像の場合
Googleに学ぶ、ウェブページのパフォーマンスを最適化する方法
Web Performance Best Practices 下記、ウェブページのパフォーマンスを最適化するポイントをまとめたものです。 キャッシュの最適化 往復遅延時間を減らす HTTPリクエストを減らす ロードサイズを減らす レンダリングの最適化 関連書籍 1. Optimize caching キャッシュの最適化 ブラウザのキャッシュを活用 JavaScriptやCSSファイルや画像などのスタティックなリソースは、HTTPヘッダを使用してキャッシュをロードするようにします。 アドバイス スタティックなリソースは全て、積極的にキャッシュにセットします。 時々更新するリソースのキャッシュには、ファイルパスにフィンガープリントを埋め込みます。 IEでも確実にキャッシュされるように、Varyヘッダは削除します。 URLを自動生成している場合は、Fxのディスクキャッシュで使用している8文字のラ
Ywcafe.net
Ywcafe.net This Page Is Under Construction - Coming Soon! Why am I seeing this 'Under Construction' page? Related Searches: Free Credit Report music videos Migraine Pain Relief Best Mortgage Rates Credit Card Application Trademark Free Notice Review our Privacy Policy Service Agreement Legal Notice Privacy Policy
PHPスクリプトの遅い部分を簡単に見つける方法
extension=xdebug.so xdebug.profiler_enable = 1 xdebug.profiler_output_dir = /tmp と設定して、apacheのリロードを行えばXdebugが動作します。 これで、あとは、ブラウザで調査したいページにアクセスすれば、 /tmp/ 以下にプロファイルデータが作成されていきます。 次にプロファイルデータの閲覧の為に、 http://sourceforge.net/projects/wincachegrind/からWinCacheGrindをダウンロードしてwindowsマシンにインストールします。 あとは、WinCacheGrindで作成されたファイルを取り込めば、関数ごとの 実行時間をたどりながら確認することができます。 ※WordPress2.7.1日本語版インストール直後のTOPページで試してみた場合です。 We
漢(オトコ)のコンピュータ道: MySQLを高速化する10の方法
ちょっとキャッチ−なタイトルをつけてしまったが、今日は独断と偏見でMySQLを高速化する方法を10個紹介しよう。MySQLサーバをチューニングするときや初期導入する場合などに参考にしてもらいたい。 1. バッファを増やす、または減らす チューニングの基本中の基本であるが、適切なバッファサイズを設定することはパフォーマンスチューニングの要である。主なバッファは次の通り。 innodb_buffer_pool_size・・・InnoDBだけを利用する場合は空きメモリの7〜8割程度を割り当てる最も重要なバッファである。余談だが、実際にはここで割り当てた値の5〜10%ぐらいを多めにメモリを使うので注意が必要だ。 key_buffer_size・・・MyISAMだけを利用する場合は、空きメモリの3割程度を割り当てるといい。残りはファイルシステムのキャッシュ用に残しておこう。 sort_buffer_
[PHPプロ!] MySQLのクエリを最適化する10のTips：CodeZine
Jaslabs: High performance phpでMySQL のクエリを最適化するための10のTipsが公開されています。explainを利用した一般的な方法から、SELECT・INSERTのクエリオプションを使用するような方法まで紹介されています。MySQLクエリの速度低下にお悩みの方は一度読んでみるとよいでしょう。 1. explainコマンドの使用 explainコマンドはクエリでどのインデックスが指定されているのか、などの情報が取得できます。 explainコマンドの実行結果を見ながらインデックスが使用されるようにクエリを修正したり、インデックスの追加を行います。詳細についてはMySQL 4.1リファレンスマニュアルを参照してください。 2. 権限の簡易化 テーブルの権限が複雑になればなるほど、オーバーヘッドが大きくなります。GRANT文で設定された権限が単純であ
sanonosa システム管理コラム集: サーバのボトルネックはどうやって調べるか
サーバのレスポンスが遅くなると経験のないサーバ管理者は無意味にメモリ増強を行ったりしますが、行き当たりばったりのシステム拡張は無駄な投資につながります。ボトルネック個所の調べ方は案外簡単なので、この際押さえるところをきちんと押さえて正しい方法論でシステム拡張をしていきましょう。 【一般論】 ボトルネックとなりうる要素は主に４つです。 ①CPU使用率 ②メモリ使用量 ③ディスクI/O ④TCPコネクション数 これらを押さえておけばボトルネック個所の把握とその解消は難しくありません。これを踏まえた一般論を述べてみたいと思います。 WEBサーバの場合は多くの場合、TCPコネクション数から先に限界が来ます。OSやApache等のWEBサーバのパフォーマンスチューニングを十分施すことが前提ですが、その場合TCPコネクション数1万くらいまではなんとか保てると思いますが、それ以上のTCPコネクショ
Operaをさらに高速にする、あまり知られてない10の方法 α - by edvakf in hatena
はじめに 2ちゃんねるでは下のようなコピペが「爆速」として知られているようだが、その他にもOperaを速くする方法はまだまだある。 アドレスバーにopera:configと入力 クイック検索に「Interpolate Images」と入力 Interpolate Imagesのチェックボックスを外す クイック検索に「Update」と入力 First Update Delayを「500」 Update Delayを「100」 Opera再起動 昨日見つけた記事では、実際に彼のコンピューターでは速くなったよ、として以下の10点が挙げられている。日付が2008年6月29日なので、もちろんOpera 9.5にも対応している。 10 Tips To Speed up Opera 9! - STUFF!!!! - by Higio なお、メニュー等は英語版のものしか知らないところも多いので、スクリーン
Apacheの負荷の状況を監視できる、apachetop - UNIX的なアレ
Unix/Linux系OSの場合で、負荷監視のツールといえばtopが有名ですが、apacheの詳細までは監視することができません。 とくに、ある程度のアクセス数のあるWebサイトを運用したことのある方ならわかると思いますが、攻撃と思われるような負荷に出くわすことはあると思います。 そんなときに、簡単にapacheの状況を調べることができるのがapachetopです。 どんなときに使う？ apachetopということで、使用するのはWebServerです。アクセスが多くでサーバーが高負荷になっているなーとある程度自分なりに判断できたときに使います。 Debian/Ubuntuであればインストールは簡単。 # sudo apt-get update # sudo apt-get install apachetop 簡単に使ってみよう 使用方法も簡単です。 apachetopはapacheのアク
Windows XP の動作を軽快にしたい - mtblue.org
ご案内：このページ「Windows XP の動作を軽快に(軽量化・高速化)したい」は、ウェブサイト「 mtblue.org 」の中のページの一つです。サイト内のページを少しでも効率よく参照していただけるよう、次の機能を提供しています。ご利用ください。 サイト内検索 サイトマップ また、トップページからこのページまでのアクセスの経路を示す情報を提供しています。この情報は、ページの先頭付近と終端付近で合計二度提供されていますので、この情報が二度目に出現した箇所を、ページの終端と捉えていただくことができます。一度目の出現はこのご案内の直後です。すなわち、次のような形式で提供しています。以上で、ご案内を終わります。 HOME ＞ PC関連 ＞ ちょっとしたTips ＞ Windows XP の動作を軽快に(軽量化・高速化)したい Windows XP は、軽快に動作するよう設計されていますが、シス
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CloudFrontをかますとキャッシュなしのAPIコールでも速くなるようだ : sonots:blog
?D of K