Improving third-party web performance at The Telegraph
At The Telegraph we’re currently going through a process of rebuilding our public-facing website. This gives us the opportunity to take learnings from the existing build but also write some of the code from scratch. You can see our progress so far on pages such as Gaming and Culture. We can monitor the impact this has on metrics across usability, performance and accessibility. We’re incredibly pas
Faster input events with Facebook’s first browser API contribution
Faster input events with Facebook’s first browser API contribution UPDATE Nov. 19, 2020: As of Chrome 87, the IsInputPending API is now available without the origin trial. The latest API incorporates a number of updates we’ve made in response to feedback from the origin trial, as well as from other members of the W3C Web Performance working group. The time it takes for an interaction to go from th
アメブロ2019: こえのブログでのPWA | CyberAgent Developers Blog
こえのブログは「声で書くブログ、声で聴くブログ、声で観るブログ」をコンセプトに書き手、読み手双方にバージョンアップしたブログを提供するアメブロの新機能です。 投稿者は端末に向かって喋るだけで、その音声が活字化されブログとして公開できます。閲覧者は活字化された文字を通常のブログと同じように読めるほか、音声を聴きながらでもコンテンツ消費できます。 モバイル端末、テレビ端末やスマートスピーカーなどの普及により、今後ますます増えると予想される利用形態に対して、それぞれに適した形でコンテンツを提供できるように挑戦しています。 この記事では、技術的な側面を中心にこえのブログを紹介します。 こえのブログは、文字でも音声でもコンテンツ消費できるのが特徴です。読者の方へのメッセージや質問に回答など利用法は様々です。龍玄としさんやクロちゃんさんなど著名人の方の声も聴けます。 できる限りサーバーにアクセスしない
setTimeout()/setInterval() are now deferred during page load (Affecting) | Firefox Site Compatibility
Starting with Firefox 66, timers added with the window.setTimeout or window.setInterval method during page load will be given a low priority and deferred until an idle time is available or the loading is complete. While this change aims at improving the performance of complex web applications like Google Docs, unexpected race conditions could occur if the initialization code is not designed proper
Vueで作ったSPAの表示速度改善でやったこと - Qiita
Vue.jsを全く触ったことないところから始めて、SPAのWebサービスを2ヶ月でリリースできたのだけど、同僚から「ちょっと表示が遅いですね」と言われた。それまではとにかく機能を動かすのとソースコードの見通しを悪くしないようにというのだけ気にしてて、パフォーマンスをあまり気にしていなかった。 で、少し気になって試しにGoogleのPageSpeed Insightsで計測してみたところ、なんとモバイルで26点だった。PCの方でも52点。 これはマズイと思い、いろいろ試行錯誤してモバイル72点、PCは98点まで改善したので、以下したことをまとめておく。 Google Fontsの読み込みの最適化 まずはこれ。Google Fontsはカッコイイけど、公式にあるCSSでの読み込みをするとめちゃくちゃ表示を遅くしてしまう。 AMP にも対応！Google Fonts を preload で先読み
手元のコードのパフォーマンスを計測するperformance.markのスニペット
一部の機能をパフォーマンス改善したときにそれを計測したり、データを集めたいときがあります。 しかし、それだけのためにライブラリを追加するのも面倒くさい(実装後に計測コードは外すので)し、コンソールに結果を出すのもデータ収集的にイマイチです。 // よくあるコンソールに表示するパフォーマンス計測コード const start = performance.now(); // ------------ // 計測したい処理を書く // ------------ console.log(`${performance.now() - start}ms`); 結果をコピーしてSpreadSheetなどで可視化できたり、処理時間と関連する要素も保存しておきたいです。 (コンソールに出力すると埋もれたり、加工がめんどうです) そのようなときによく使っているPerformance.mark()とPerfor
GitHub - WICG/js-self-profiling: Proposal for a programmable JS profiling API for collecting JS profiles from real end-user environments
Currently it is difficult for web developers to understand how their applications perform in the wide variety of conditions encountered on real user devices. A programmable JS profiling API is needed to collect JS profiles from real end-user environments. A native self-profiling API for JS code would also allow web developers to efficiently find hotspots in their JS code during page loads and user
Fast string concatenation in JavaScript
Fast string concatenation in JavaScript Attention: Shared Google-externally�Author: bmeurer@�Last Updated: 2019-03-21 TL;DR Fast String concatenation is hard in JavaScript. Engines have plenty of clever optimizations in place that make it non-trivial to find the best approach. This document outli...
JavaScript Loading Priorities in Chrome
February 18, 2019 How browsers schedule and execute scripts can impact the performance of web pages. While techniques like <script defer>, <link rel=preload> (and others) influence script loading, knowing how browsers interpret them can also be helpful. Thanks to Kouhei Ueno, we now have an up to date summary of script scheduling in Chrome.
Rendering on the Web | Articles | web.dev
Published: February 6, 2019, Last updated: January 5, 2026 One of the core decisions web developers must make is where to implement logic and rendering in their application. This can be difficult because there are so many ways to build a website. Our understanding of this space is informed by our work in Chrome talking to large sites over the past few years. Broadly speaking, we encourage develope
GitHub - WICG/scheduling-apis: APIs for scheduling and controlling prioritized tasks.
This document outlines the motivation for working on various scheduling APIs1, discusses some of the problems that apps and userspace schedulers face when writing scheduling code, and links to various proposals we are working on in this space. (1The scope of this work was previously restricted to main-thread scheduling, and while main-thread scheduling remains the primary focus, the repository and
サードパーティJavaScriptの最適化 - 一休.com Developers Blog
本記事は、一休.com Advent Calendar 2018の4日目の記事です。 qiita.com 宇都宮です。宿泊事業本部でWebフロントエンドの開発をしています。 今日は、パフォーマンス改善に取り組むフロントエンドエンジニアの多くが頭を悩ませているであろう、サードパーティスクリプト(3rd Party JavaScript)について書きます。 サードパーティスクリプトとは サードパーティスクリプトとは、外部のドメインから読み込むJavaScriptのことです。典型的には、Google Analytics等のスクリプトが、サードパーティスクリプトに該当します。 一休.comでは、サードパーティスクリプトを、アクセス解析・広告のリターゲティング・A/Bテスト等、様々な用途に使用しています。これらのスクリプトは、一つ一つは小さなものであるため、画面表示のスピードに対するインパクトは意識
CSS and Network Performance – CSS Wizardry
9 November, 2018 CSS and Network Performance Written by Harry Roberts on CSS Wizardry. Table of Contents Independent writing is brought to you via my wonderful Supporters. What’s the Big Problem? Employ Critical CSS Split Your Media Types Avoid @import in CSS Files Beware @import in HTML Firefox and IE/Edge: Place @import before JS and CSS in HTML Blink and WebKit: Wrap @import URLs in Quotes in H
Inlining or Caching? Both Please! | Filament Group, Inc., Boston, MA
Inlining or Caching? Both Please! Posted by Scott Jehl 11/13/2018 Last week, I was finishing a section of my slides for a presentation at the Performance.Now() conference. In it, I was exploring patterns that enable the browser to render a page as fast as possible by including code alongside the initial HTML so that the browser has everything it needs to start rendering the page, without making ad
The Three Types of Performance Testing – CSS Wizardry – CSS Architecture, Web Performance Optimisation, and more, by Harry Roberts
27 October, 2018 The Three Types of Performance Testing Written by Harry Roberts on CSS Wizardry. Table of Contents Independent writing is brought to you via my wonderful Supporters. Proactive Reactive Passive What This Means for Developers What This Means for the Business A lot of companies—even if they are aware that performance is key to their business—are often unsure of how, when, or where pe
JS Self-Profiling API とは - ASnoKaze blog
W3C Web Performance Workingの議事録に「JS Self-Profiling API」についての議論があったので簡単に眺めておく。 ミーティングの「発表スライドはこちら」 JS Self-Profiling API いわゆるRUM(Real user monitoring)などと同様、実際のユーザ側でJavaScriptのプロファイルを取得可能にするというのが「JS Self-Profiling API」のようだ。 ユーザにより端末やネットワーク環境が違うため、実際のユーザ側でJavaScriptのプロファイルを取りたい。timerを使うことで擬似的に測定はできるが、コード量やオーバヘッドが増える。この提案を行っている、Facebookの人らはJavaScriptとSharedArrayBuffersでサンプリングプロファイラを実装したが正確性とパフォーマンスの欠点
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - patrickhulce/third-party-web: Data on third party entities and their impact on the web.
SpeedCurve | JavaScript growth and third parties
GitHub - GoogleChromeLabs/quicklink: ⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time
perf-tools/timekeeper at master · artifact-project/perf-tools · GitHub