reactjs / reactjs/react.dev

Slow load times and flickering in Safari

オープン
#6,548 コメント 0 件 リアクション 2 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

主要言語
JavaScript
スター
11.8k
フォーク
7.9k
平均マージ
1日 11時間
マージ済み PR(30日)
11

説明

I've been going through the react.dev docs and noticed that they feel sluggish:

https://github.com/reactjs/react.dev/assets/513444/0679274a-9325-4975-afea-b7e5315cffc2

I still see a little bit of flickering on Chrome, but I wouldn't consider it problematic there:

https://github.com/reactjs/react.dev/assets/513444/d1faca05-2606-4bf0-b680-c9f67e2b9fdf

The new site has a lot of interactive elements so it's not fair to compare it with the legacy site, but legacy is an order of magnitude faster:

https://github.com/reactjs/react.dev/assets/513444/fabe323d-e3d4-44d1-b5b7-f42bdcdabfa7

I think there are two separate issues:

  • Some (larger) pages take several seconds to load
  • Scrolling in Safari makes the screen flicker

This is on Safari Version 17.2.1 (19617.1.17.11.12) on Sonoma 14.2.1 (23C71). 2,6 GHz 6-Core Intel Core i7 MacBook Pro 16. Let me know if you need any other information to help debug.

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

まず、リンクされた録画を使用し、Chromeおよびレガシーサイトと比較しながら、react.devの大規模なドキュメントページでSafari 17.2.1における報告された挙動を再現します。遅い読み込みとSafariでのスクロール時のちらつきが解消されるか、原因が明確に切り分けられ、報告されたブラウザー全体で挙動が確認できれば完了です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
javascript, react
領域
documentation, frontend, performance
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
25/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。