500点出す！ - ゆーすけべー日記
「Web Speed Hackathon 2022」という「非常に重たいWebアプリをチューニングして、いかに高速にするかを競う競技」があります。 リモート参加で11月1日から27日まで開催されています。 ここで言う「高速」とはCore Web Vitalsのスコアが高いことを言い、Lighthouseのスコアをベースにした500点満点の争いです。 ISUCONのフロントエンド版ですね。 以前にも同じ課題で「学生向け」と「社内（サイバーエージェント）向け」が行われたらしく、まだ500点を出した人はいません。 そこで僕は「満点を出したい」と思い、初日から、いやむしろフライングしていたからその前から頑張ってきました。 そして、先日（17日）、ついに500点満点を出しました！ たぶん、レギュレーションはクリアしている、はずです（もし違反してたらすいません…）。 自動で行われる「Visual Re
「もうさばき切れない」アクセスが激増したECプラットフォームにおける負荷対策 - BASEプロダクトチームブログ
はじめに CTOの川口 (id:dmnlk) です。 5月にオンラインmeetupをさせて頂きその中で「具体的な負荷対策に関しては開発ブログで！」と言っていた件ですが気づいたらもう9月になりかけていました。 コロナ禍においてネットショップ作成サービス「BASE」の利用者様が急増しました。 www.nikkei.com 5 月には 100 万ショップを超えるショップオーナー様にご利用していただいております。 今まで EC 事業を行っていなかった飲食店様や様々な業種の方が利用をはじめていただき、ショップオーナー様も購入者様共に短期の見通しでは想定をしていないアクセスが発生しました。 その途中でシステムとして対応しきれない面もあり、アクセス負荷によるサービスの不安定を招き皆様にはご不便や販売時間を変更していただくお願いなどをしてしまい大変申し訳ありませんでした。 現在では安定しておりますが、その
日経電子版を速くする / nikkei-inside-frontend - Speaker Deck
Inside Frontend #2 の発表資料です https://inside-frontend.com
dev.toと阿部寛のホームページについてちゃんと計測させてくれ - Qiita
Twitter見てたら、以下のツイートを見た。 数時間後、dev.toと阿部寛のホームページどっちが速いですか？というブログがTLに現れた。 GoogleのPageSpeed Insightsで測って阿部寛のホームページの方が早かったという結論付けてよいのかという疑問が浮かび、webpagetest.orgで計測することにした。 設定 阿部寛のホームページに関しては、Tokyoリージョンにあるものとする。 そして、dev.toはNY発らしいので、サーバーの設定をNYにして測定する。 The platform was created in 2016. The twitter account, @ThePraticalWeb 評価結果 Webpagetest - 阿部寛のホームページ Webpagetest - dev.to
Making dev.to insanely fast
It makes me smile when someone raves about how fast this website loads, because that's no accident. We put a lot of effort into making it so. It is the sort of thing that usually goes unnoticed, but when your readers are developers, there's a better chance they notice and appreciate it. I have written about this in the past, but it's worth re-examining because these ideas are always evolving. From
Webサーバのベンチマークツールはh2loadが便利 - 人間とウェブの未来
Webサーバのベンチマークをとるのが趣味になりつつあるmatsumotoryです。 Webサーバのベンチマークについては、abからはじまりwrk等を使っていたのですが、最近ではほぼh2loadを使っています。 h2loadはnghttp2というHTTP/2ライブラリのアプリケーションに含まれているツールですが、 HTTP/2（SPDYも）とHTTP/1.xに両対応している ベンチマーク側の同時スレッド数を増やせる TLS及びSNIもサポートしている 最小、最大、平均、標準偏差あたりもちゃんとでる ので、色々プロトコルを変えつつ同じベンチマークツールで、値の目安を出すにはとても重宝しています。 Nghttp2: HTTP/2 C Library - nghttp2.org 実行結果のサンプルは例えば以下、 $ h2load -c 100 -n 10000 https://localhost:
Webアプリケーション負荷試験実践入門
2015年2月24日 ヒカ☆ラボ発表資料 Webアプリケーション負荷試験実践入門 ■スライドの目的 負荷試験の重要性を認識して頂く 意味のある負荷試験を最短距離で行うための“段取り”を持ち帰って頂く 内容的には、主にAWS上のLAMP構成のシステムに対する負荷試験ですが、負荷試験ツールに依存しない全般的に通用する話を扱っています。Read less
ブラウザー・キャッシュの今
元々「静的なファイルは限界までキャッシュしろ！」というような金言はそれほど重要視していなかった。The changing role of the browser cacheという記事では、開きっぱなしにされるタブと継続的デプロイをキーワードに、ブラウザー・キャッシュの役割が変化していることを解説している。 ブラウザー・キャッシュが再訪問に対して威力を発揮するのに対し、開きっぱなしにされるタブでは再訪問されることはなく、継続的デプロイされるアプリケーションではその効果は限定的なものにしかなりえない、という意見だ。納得の出来る意見ではある。 僕が元々こういった長期間のキャッシュに疑問を持っていたのも少し似ている。特に継続的デプロイの元では限定的な効果になることは自明だと考えていた。またいわゆる普通のウェブページにおいては再訪問という行為そのものが随分前から死滅したとも考えている。具体的にはソー
DOM Performance (JSNext Bulgaria)
In the client-side development we manipulate the DOM very often. Some of these manipulations take some time to execute, others take even more time. In a complicated JS-based software, it is very important to find the optimal approaches in order to get best performance. We will meet few very common cases, where standard DOM manipulations are very expensive, and we will see what is the optimal way t
EC2など 高負荷クラウド環境における Redis のチューニングについて - tech.guitarrapc.cóm
たまにはPowerShell 以外の記事を。 某記事でもRedis (REmote DIctionary Server)が memcached に代わり得る利点がBookSleeveを交えて丁寧に説明されました。 そして、Redisの運用が一定の目途を見せていることから、その初期設定に欠かせないチューニングについて記事にしてみようと思います。 全部明かすわけではありませんが、なかなかRedisに関する記事は少ないので、少し参考になれば幸いです。 経験上、高負荷環境ではRedisはチューニングで大幅に安定性が変わります。 インストール? 沢山記事ありますし、簡単なのでここでは省きます。 どうしても！な場合は希望していただければ記事にしますが。 Redis Quick Start 対象バージョン 2.6系とします。 2.4系でも大方一緒ですが、2.6系に特有な部分があるので、注意です。 対象O
サイトパフォーマンス: 1000msを目指す取組み - ワザノバ | wazanova
Guardian誌のPatrick HamannがLondon Web Performance Meetupで、モバイルサイトのパフォーマンス向上の取組みについて講演しています。 まずは、Web Performance TodayのeCommerceに関する調査で、 ユーザの期待するページ読込み時間は、2000年の8秒から、2012年には2秒を切るレベルまで下がってきている。 ことを挙げ、1秒以下を達成するには、 3Gネットワークでは、DNS Lookup / TCP Connection / HTTP Request & Responseで 600ms （Guardianのある英国ではそれ以上）はかかる。残りの400msで、Server Response TimeとClient-side Renderingを最適化する必要がある。 というGoogleのPageInsightの分析結果を紹
ISUCONで学ぶ Webアプリケーションのパフォーマンス向上のコツ 実践編 完全版
【第26回Elasticsearch勉強会】Logstashとともに振り返る、やっちまった事例ごった煮Hibino Hisashi
「超チューニング祭 ～ニコニコを超快適にしてみた～ in ニコニコ超会議３」の問題点 - Webパフォーマンスについて
来る2014年4月26日(土)・27日(日)に、「ニコニコ超会議3」が開催され、その中で「超チューニング祭 ～ニコニコを超快適にしてみた～」が開催されるそうです。 これは、現行のスマートフォンサイトのTopページのソースファイルを競技者がチューニングして、速度やデザイン・UIの改善をして、速度と使い勝手を競うのだそうです。 「これは面白そうだ! 会場は家から近いし!」と思って参加するつもりでいましたが、事前調査で計測してみた結果、フロントエンドのチューニングでは速くならないことがわかったので、その内容について説明します。 (主催者の方にも、フロントエンドのチューニングでは速くならないという情報は伝えてあります。) まずは、計測データ まずは実際のトップページ(http://sp.nicovideo.jp)の計測データを見てみましょう。 計測は、NTT DoCoMoとSoftBankの3G回
HTTPリクエストを減らすために【CSS Sprite編】スプライト地獄からの解放 - MOL
このシリーズはHTTPリクエストの理解を通じてWebパフォーマンスの重要性について考える5章構成になっている。 【序章】HTTPリクエストは甘え 【CSS Sprite編】スプライト地獄からの解放 【WebFont編】ドラッグ＆ドロップしてコマンド叩いてウェーイ 【DataURI編】遅延ロードでレンダリングブロックを回避 【終章】我々には1000msの猶予しか残されていない 2日目は、HTTPリクエストを減らす最もポピュラーな手法、CSSスプライトについて説明する。 まずは動画をご覧頂きたい。 img要素読み込み | WebPagetest Test Result CSS Sprite読み込み | WebPagetest Test Result 左が30個のアイコン画像を一つ一つimg要素として読み込んでいるのに対して、右は１つの背景画像（CSSスプライト）として読み込んでいる。この場合、
ruby 2.0.0-p195 + fluentd v0.10.35 + msgpack v0.5.5 の組合せが素敵という話 - たごもりすメモ
fluentd v0.10.35 が出ましたね！ https://rubygems.org/gems/fluentd で、端的に申し上げまして fluentd をお使いの皆様は以下の組合せで使うのがおススメです。 Ruby 2.0.0-p195 Fluentd v0.10.35 MessagePack v0.5.5 なぜかというと以下のようなすばらしい利点があるからですね。 Ruby 2.0.0 でfluentdを走らせると大変高速 2.0.0 は each とかを回すときに非常に高速になるような改良が入っている 1.9.3 向けには funny-falcon patch として知られていたもの rvm を使ってビルドしていたrubyだと知らずに当たってるかも これが大量のメッセージに対してループが回りつづけるFluentdに超ハマる 手元計測で生の 1.9.3 の倍ちょっと高速 Ruby
Linuxで3万（10万）プロセスを同時に起動させてみた
人間とウェブの未来（旧） 「ウェブの歴史は人類の歴史の繰り返し」という観点から色々勉強しています。2014年までの人間とウェブの未来の旧ブログです。 といっても、きちんとした検証をしたわけではないので、あくまで「こういう環境でこういう事をやるとこうなる」という参考程度のものと理解してい頂ければ幸いです。 Linux上でプロセスは同時に何個起動できるのか 数年前にC10K問題が流行りました。これは、簡単に言うと、万のオーダーでプロセスを立ち上げる事になると、現状のOSではそれを想定した設計になっていないためまともに動かなくなる、といった問題でした。 だったら、「10万プロセス位を同時に立ち上げてみて、どうなるか試してみようぜ！」と思い、会社のエンジニアと一緒に試してみました。検証環境は、メモリ48GでCPUはHyperThreading込で24コアです。そこで動いていたOSはDebianでL
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Webpackのビルド時間を1/3にした話 #gotandajs
ねこでもわかる！ ITインフラ・パフォーマンスチューニング
コマンドによる「負荷」の原因切り分け
agilecatcloud.com