コンペページの描画の高速化

(直接コンペと関係のない内容なのですが)

本コンペのページの背景に使われている画像(論文とビーカーの写真)のサイズは 10 MB あり、ページをスクロールするたびにこれが再描画されるらしく、その結果スクロールが非常に低速になっています。
(PageSpeed Insights でパフォーマンスを見てみてもこの画像のサイズの大きさが際立ちます。 https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fprob.space%2Fcompetitions%2Fcitation_prediction)

この画像の描画を無効化すれば、スクロールが快適になり、トピックを読むのも捗ります。以下の JavaScript を開発者ツールのコンソールやブックマークレットで実行すれば背景画像を消すことができます。

document.querySelector("body > div > div.text-light.py-5.fixed-cover").style.backgroundImage = null

私は Chrome 拡張機能の ScriptAuto Runner (https://chrome.google.com/webstore/detail/scriptautorunner/gpgjofmpmjjopcogjgdldidobhmjmdbm/) にこのスクリプトを登録して自動で実行しています。ただし、サイト内のページ移動のときに実行されない場合があるので、その場合は面倒ですがページをリロードして下さい。

Aws4 request&x amz signedheaders=host&x amz signature=a59951711d7dd863725161b05f3915b65e78f8a25a8b900c3ae25e0ea9a371e7
ProbSpace_official

pn11様

エンジニアリング視点からのトピック作成ありがとうございます。
根本原因となっているデータサイズの点、今後のコンペ設計において留意させていただきたいと思います。

なお、本コンペの背景画像につきましては、データサイズを落とした画像を再掲載いたしました。
またページスクロール時の再描画に関する課題につきましても、将来的に対応させていただきます。
(他課題との兼ね合いもあり、コンペ期間内には改修が間に合いませんことご了承ください)

どうぞよろしくお願いいたします。

Favicon
new user
コメントするには 新規登録 もしくは ログイン が必要です。