ウェブサイトを閲覧していると「画像の読み込みが遅い」という場面に遭遇したことがある人は多いはず。画像はウェブサイトのパフォーマンスを左右する要素のひとつであり、ウェブ開発において取り扱いに注意すべきものです。そんな画像をウェブサイトで扱う際の最適化方法について、GoogleのエンジニアであるMalte Ubl氏が解説しています。 Maximally optimizing image loading for the web in 2021 https://www.industrialempathy.com/posts/image-optimizations/ ◆img要素にwidthとheightを指定する アスペクト比を維持したまま画像サイズを変更するには、「style」要素に「max-width: 100%」や「height: auto」と指定しておく手法がよく用いられます。この手法に加
テレビで素敵なサイトが紹介されていたのでアクセスしてみたら、なかなかレスポンスが返ってこなかったりステータスコード503になったりすることってありますよね。 テレビで紹介されたことで多くの人がサイトにアクセスした結果、そのサービスのキャパシティを超えてしまったわけです。 どうなるとキャパシティを超えるのでしょうか？ また、いつからレスポンスが遅くなるのでしょう。 効果的にリクエストをさばくにはどうしたらいいのでしょう。 Photo by Roman Arkhipov on Unsplash 待ち行列理論を使って理想的なモデルからこれらを考えてみたいと思います。 待ち行列理論はコンピュータサイエンスをやってきた人はみんな触れたことがあるとは思いますが、大石の場合はそれが何十年も(!)前のことなのであらためて思い出してみました。 モデル Railsでサービスを提供するとき、rackサーバとして
Let’s make 2021… fast! An annual front-end performance checklist (available as PDF, Apple Pages, MS Word), with everything you need to know to create fast experiences on the web today, from metrics to tooling and front-end techniques. Updated since 2016. Ah, you can also get useful front-end tips in our email newsletter. This guide has been kindly supported by our friends at LogRocket, a service t
Webパフォーマンス向上施策のために、今更ながら超速本1を読んだので、今までの自分の知見と合わせてまとめてみます。 なるべく柔らかく、**改善施策ってまず何をどうすればいいの？**という疑問を持った人に向けて書いています。 ▪️格言 そもそもWebは速い。遅くしているのは我々です。大抵は技術の問題ではなくて、人の問題。 引用元： テクニックではなく、今、本気で取り組むべきWebパフォーマンス （html5jパフォーマンス部 部長 竹洞さん） 心得 パフォーマンス向上に対する施策は大別すると以下の２通り 軽量化 （単純にやりとりするデータ容量を小さくすること） 圧縮 削除 最適化 （その時に最も適している実装・実行をとること） 経路・順番の変更 非同期 もっとも遅くしている原因を探して、それを対策するのが原則。「対効果」が絶対的正義である。手段から入るのは愚策。まず先に原因を知ることが重要。
Erlang製のtsungというツールを使って負荷をかけました。 これは、複数のサーバをクラスタ化して負荷をかけることができるので、負荷側が先にパンクするケースを軽減できます。 パフォーマンス測定の前に actix_web 関係なく、 もはや Webサーバの基本と言っても良いのですが、actix_webを動作させるサーバと負荷サーバの両方で、 ulimit(システムリソース上限) と tcp系のカーネル・パラメータを調整します。 ulimit システムリソース上限を上限いっぱいに設定します。 /etc/security/limits.conf を編集します。 root soft nofile 65536 root hard nofile 65536 * soft nofile 65536 * hard nofile 65536 再起動します。 カーネル・パラメータ いくつかのカーネル・パラ
日本経済新聞は国内を代表する経済誌だ。その電子版はwebでの継続課金を大成功させ、いまや50万以上の有料会員を擁するモンスターサイトだ。 その日経電子版が11月6日に全面リニューアルしたのだが、公開後、web業界がにわかにざわついた。表示速度が爆速だったのだ。日経公式もモバイルで2倍の表示速度を達成したと堂々と宣言していた。 webサービスは継続率こそ神KPIで、その継続率には速度が大きく影響する。 これはチェキらないとヤバイと感じ、友人のkitakさんとスピードの秘密を調査してみた。 Fastlyをコンテンツキャッシュに使う殆どのデータはFastlyを経由して取得されていた。Fastlyは最近注目を集めているCDN（世界中にエッジサーバーを配置し、高速にコンテンツを配信するサービス）で、非常に高機能でユニークなサービスだ。 一般に、CDNはいったん世界中にコンテンツをばらまくと、それを無
本のページをめくるように、どんなWebページも素早く表示できるようにする。グーグルは以前からWebの高速化に取り組んできました。 6月22日から、米サンタクララで行われていたWebサイトのパフォーマンスと運用に関するオライリーのイベント「Velocity 2010」では、グーグルのUrs Hölzle氏がWebの高速化技術について「Speed Matters」（スピードの重要性）というセッションで紹介ています。 Webを高速化するためにどのような技術があり、あるいはどのような技術が検討されているのか、このセッションの内容を紹介しましょう。 スピードは重要だ 私が話そうとしているのは、「Speed matters｣（スピードの重要性）についてだ。Webは空飛ぶジャガイモより速くなれるだろうか？ どのくらい速くなれるだろうか？ （参考：オペラがやってくれた！ グーグルの空飛ぶジャガイモに対抗）
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 ※ 追加情報も掲載しました。併せてご覧ください。 iPhone などのモバイルデバイスで Web を見ていると、 PC とは比べものにならないもっさり感がとてもストレスです。細い 3G 回線ではなかなか快適なブラウジングはできません。しかし、スマートフォンをはじめとするモバイルデバイスは急速に普及していますから、それらで軽快に閲覧できるサイト作りの重要性は、今後ど
これを書こうと思ったキッカケは、奥一穂さんの「ウェブアプリケーションサーバを複数台構成とか2010年代には流行らない」っていう、最近モヤモヤと感じていたことをうまく説明してくれてる記事をみたこと。 年始からちょくちょくサーバの運用環境を物色しながら考えていたことと見事にシンクロした。だいたいの要旨はTwitterのほうでも書いたのだけれど。 ムーアの法則でどんどん向上する技術にくらべ、人間のキャパシティは変化しない定数項として考えていい。だとすれば、そうやって向上する性能を、人間の労力を削減する方向で使えてはじめて、「技術が競争優位性を生む」といえるだけの破壊的な価値がでてくるということになる。 では、現在の技術トレンドを活用することで減らせる「人間の労力」とは何か。 それは、過去10年あまりで定着した、これまでの（そして今なお）Webアプリケーションの定番構成である、「ロードバランサ、ア
(this is only for HEAD - old docs are found in the git repo) A Web Server Called Ebb Ebb aims to be a small and fast web server specifically for hosting dynamic Ruby language web applications. It is a binding to libebb Install The Ruby binding is available as a Ruby Gem. It can be install by executing gem install ebb If you want SSL support you must install GnuTLS. Ebb has no other dependencies.
¶ Tornado is a Python web framework and asynchronous networking library, originally developed at FriendFeed. By using non-blocking network I/O, Tornado can scale to tens of thousands of open connections, making it ideal for long polling, WebSockets, and other applications that require a long-lived connection to each user. Quick links¶ Current version: 6.4.2 (download from PyPI, release notes) Sour
ここ数年の大規模サービスのシステム運用について調べてみたので参照したページやファイル、本へのリンクをまとめておく。PDF へのリンクも多数含まれているのでご注意を。 時代が時代なら企業のノウハウとして隠されていたような情報がこれだけ公開してもらえているというのが非常にありがたい。公開してくれている各企業や公開してくれている人に感謝。 あとで気付いたが、Google や Facebook の事例も探しておけばよかった。Thrift とかあったのに。「こんな情報もあったよ」などあればぜひ教えてください。追記していきます。 youtube http://d.hatena.ne.jp/stanaka/20070427/1177651323 digg http://d.hatena.ne.jp/stanaka/20070427/1177651323 livedoor http://labs.cybo
Webパフォーマンスを向上させるツールとして有益なのが、Yahoo! Inc.のYSlowとGoogleのPage Speedだ。この二つはどちらもFirebugにアドオンする形で提供されている。そのため、Firefoxありきになっている。だがまだまだシェアが高いのはIEだ。 接続状態をグラフ化 実際の所、IEとFirefoxでアクセスした場合でパフォーマンスがどれくらい異なるのかは不明だが、各ブラウザでテストした方が良いだろう。そこで試したいのがPagetestだ。 今回紹介するオープンソース・ソフトウェアはPagetest、IE用Webパフォーマンスチェッカーだ。 PagetestはあのAOLが開発したソフトウェアだ。IEのアドオンとして提供されており、別ウィンドウで表示した状態で任意のWebサイトにアクセスするとその接続状態についてモニタリングし、結果を表示してくれる。 チェックリス
Learn Discover best practices that can make your apps faster. Get informed with developments in web performance. What would be possible if browsing the web was as fast as turning the pages of a magazine? We invite you to join us in exploring and innovating across the entire spectrum of performance - from Internet protocols to the browser to website development. Together, let's make the web faster!
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く