Osu-web: A lot of rendering time used to display website

Created on 19 May 2018  路  1Comment  路  Source: ppy/osu-web

(Well, I've already opened a similar issue once concerning the leaderboard's performance on a slightly older device (namely an iPhone 5).)
I looked into the performance tab of the chrome dev tools and saw that there was a lot of rendering being done when you're scrolling, sometimes up to half the time:

image
_Performance report of osu performance leaderboard_

While this probably isn't a problem on most PCs, it can cause lags on mobile devices (even on a newer iPhone 8 it wasn't completely smooth).

Here are some other reports to compare:

image
_Beatmap listing_

image
_Profile_

image
_Homepage_

Only things like news articles or the wiki don't seem to use so much rendering time:

image
_News article_

image
_Wiki_

My only questions are if you are aware of this and if you'd reconsider to optimize this a bit.

I'd gladly look into this myself, but as of right now I simply don't know enough about how this website is made up. This will also be my last issue on this topic even if you decide to leave it like that for now :)

Edit: Looking at the performance report in Chrome it seems that something causes the Layer Tree to update every time the user scrolls, even if they scroll to a part of the page they have already scrolled to earlier and which has therefore already been rendered once.

performance

Most helpful comment

We are very aware that client-side performance is really shocking, especially on certain pages. Definitely going to keep this in mind as we push out design changes going forward (which should fix these issues, bit by bit).

>All comments

We are very aware that client-side performance is really shocking, especially on certain pages. Definitely going to keep this in mind as we push out design changes going forward (which should fix these issues, bit by bit).

Was this page helpful?
0 / 5 - 0 ratings

Related issues

aticie picture aticie  路  5Comments

DigitalHypno picture DigitalHypno  路  5Comments

peppy picture peppy  路  4Comments

smileyhead picture smileyhead  路  4Comments

shortthu picture shortthu  路  5Comments