Rebuilding our tech stack for the new Facebook.com
Facebook.com launched in 2004 as a simple, server-rendered PHP website. Over time, we’ve added layer upon layer of new technology to deliver more interactive features. Each of these new features and technologies incrementally slowed the site down and made it harder to maintain. This made it harder to introduce new experiences. Features like dark mode and saving your place in News Feed had no strai
Shopping for speed on eBay.com | web.dev
Shopping for speed on eBay.com Stay organized with collections Save and categorize content based on your preferences. Optimizing the performance of eBay's sites and apps for a faster user experience. Speed was a company-wide initiative for eBay in 2019, with many teams determined to make the site and apps as fast as possible for users. In fact, for every 100 milliseconds improvement in search page
iOSアプリの起動速度を2倍にするために、複数のDynamic FrameworkをStaticにして、ひとつのDynamic Frameworkを作る with Swift
対応の比較動画 (体感2倍)エウレカ iOS エンジニアの muukii (Twitter) です🥃 私が開発を担当しているPairs Global (Pairsの海外向けアプリ)はアプリの起動がとても遅いのです。 一体なぜなのか。 OSはアプリを起動してAppDelegate (厳密にはmain関数)が呼び出されるまでには様々な処理を行います。 この部分の処理を最適化することでアプリが起動していない状態からの起動の高速化が期待できます。 アプリ起動高速化のための前置き (長め)まず、用語について、厳密には FrameworkとLibaryは異なるものですが、性質は近いので本記事では次のように用語を用います。 Static Framework または Static Libraryを まとめて 「Static Framework」と呼びます Dynamic Framework または Dy
Techniques to make a web app load fast, even on a feature phone
Techniques to make a web app load fast, even on a feature phone How we used code splitting, code inlining, and server-side rendering in PROXX. At Google I/O 2019 Mariko, Jake, and I shipped PROXX, a modern Minesweeper-clone for the web. Something that sets PROXX apart is the focus on accessibility (you can play it with a screenreader!) and the ability to run as well on a feature phone as on a high
一休.comスマホサイトのパフォーマンス改善（JavaScript編） - 一休.com Developers Blog
宿泊事業本部の宇都宮です。 一休.com スマホサイトのホテルページパフォーマンス改善プロジェクトでは、フロントエンドには以下のような要件がありました。 デザイン面は既存を踏襲する 機能はほぼ従来通り 日付等を変更した際の再検索は、画面遷移を挟まず、画面内で行えるようにする パフォーマンスをできるだけ改善する 要するに、従来と同様の機能+αを実現し、かつ、従来と同等以上のパフォーマンスを実現する、というミッションです。 このために、どのような取り組みを行ったか、紹介します。 パフォーマンス目標値の設定 まず、パフォーマンスの目標値を設定する必要があります。モバイルでは、ユーザの帯域幅は回線や時間帯によって大きな変動があります。多少回線状況が悪くても、閲覧を妨げない程度のパフォーマンスを実現する必要があります。 一休へアクセスするユーザのモニタリングを見ると、極端に遅い回線を使っているユーザ
リニューアルした日経電子版が高速すぎてヤバイ件｜こんぴゅ
日本経済新聞は国内を代表する経済誌だ。その電子版はwebでの継続課金を大成功させ、いまや50万以上の有料会員を擁するモンスターサイトだ。 その日経電子版が11月6日に全面リニューアルしたのだが、公開後、web業界がにわかにざわついた。表示速度が爆速だったのだ。日経公式もモバイルで2倍の表示速度を達成したと堂々と宣言していた。 webサービスは継続率こそ神KPIで、その継続率には速度が大きく影響する。 これはチェキらないとヤバイと感じ、友人のkitakさんとスピードの秘密を調査してみた。 Fastlyをコンテンツキャッシュに使う殆どのデータはFastlyを経由して取得されていた。Fastlyは最近注目を集めているCDN（世界中にエッジサーバーを配置し、高速にコンテンツを配信するサービス）で、非常に高機能でユニークなサービスだ。 一般に、CDNはいったん世界中にコンテンツをばらまくと、それを無
WebパフォーマンスとプロダクトKPIの相関を可視化する話 | CyberAgent Developers Blog
技術本部 Web Initiative Center で Web プロダクトの品質改善や組織の技術推進に取り組んでいます、 @1000ch です。その活動のひとつに、直帰率や PV/Session といったプロダクトの KPI を上げることを目的とした Web パフォーマンスの向上があるので、今日はその取り組みについて書きます。 旧来の Web パフォーマンスの評価指標 これまでは DOMContentLoaded イベントや load イベントの値が Web ページのパフォーマンスの良し悪しとして扱われることが多かったと思います。しかしアーキテクチャの複雑化の一途をたどる Web ページのパフォーマンスを測る上では、もはや適切な指標とは言えません。 DOM 構築完了を指す DOMContentLoaded イベント DOMContentLoaded は DOM ツリーの構築完了を表します
負荷テストツールGatlingを触ってみた - 絶品ゆどうふのタレ
負荷ツールとしてGatlingのことを少し前から耳にする機会が増えたので、利用してみることにした。 色々既出だとは思うが、公式のQuickstartに従って試してみたのでメモ。 GUIが必要だったので、今回は手元のMacで実行。 Gatlingとは Java/Scala製の負荷テストツール。 JMaterと似た感じのツールではあるが、 ハイパフォーマンス 見やすいレポートHTML developerフレンドリーなシナリオファイル というのをウリとして謳っている。 たぶん、3項目とも対JMater(重い・レポート見づらい・XMLのシナリオつらい)を意識したメリットだろうなー。 なお、シナリオファイルは。。。 Gatling simulation scripts are written in Scala, but don’t panic! わろた。 というわけで、触ってみる Install J
A new way to understand your Rails app's performance
A New Way to Understand Your Rails App's Performance Is your Rails app slow? When it takes seconds to load what should be a simple view, you have a problem worth digging into. You could have too many database calls or some slow methods. Or maybe it’s that speedup loop someone put in your code and forgot about. You can find lots of tools to help you find out what’s slowing your app down. A few week
デザイナーやディレクターも知っておきたい、ページ表示速度の高速化の基本
スマホからウェブにアクセスするユーザが増え、ウェブサイトの表示速度の高速化がより重要な制作の課題になっています。1ページもののサイトなら、フロントエンド・エンジニアが一人で実装できるかもしれませんが、ある程度の規模のウェブサイトではワークフローやサイト全体の設計にも関わってきます。また、表示速度の高速化の方法を知らなければ、最適化しやすい、より高度なデザインは実現できないでしょう。エンジニアだけでなく、デザイナーやディレクターがこういった情報を知っていれば、よりスムーズに結果を出せるウェブサイト制作ができるはずです。 ページ表示速度の改善にはいろいろな方法がありますが、この記事では一番効果がありそうなところから攻めていきたいと思います。自分もまだまだ勉強中なので、まずはfilament groupのScottさんの記事 やClearleftのJeremyさんの記事 を参考に、フロントエンド
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Top tips for web performance | Articles | web.dev
React製のSPAのパフォーマンスチューニング実例
設計から実装まで、今すぐ始める高速化