7

Today, I left Stack Overflow running for the whole morning. When I came back, I had something like 230 new questions. I clicked on the 230 questions with new activity link without thinking, which froze my browser for quite some time.

Problems

  • The AJAX called by this link is most likely sending a synchronous request.
  • The AJAX is calling way too much info than what is actually needed.

Possible solutions

  • Make the AJAX call asynchronous.
  • Limit the number of question loaded by the AJAX to how many questions the user has chosen to display per page (15/30/50).

EDIT : It seems like the AJAX isn't the problem here. My second point still stands, though.

5
  • Have you confirmed it's the AJAX call that's causing the delay, and not rendering the response?
    – Cerbrus
    Commented Jan 31, 2018 at 15:45
  • I'm entirely confident that that notification is AJAX. Otherwise you'd have to refresh the page to see anything.
    – Makoto
    Commented Jan 31, 2018 at 15:45
  • @Cerbrus How could the render time be causing the delay? There's not that much to display.
    – Zenoo
    Commented Jan 31, 2018 at 15:48
  • See my answer. I'd suggest updating the bug report to be a more general "this loading / rendering is slow!"
    – Cerbrus
    Commented Jan 31, 2018 at 15:53
  • Huh, I see any number over 10 new questions and I just hit F5 Commented Feb 2, 2018 at 17:28

1 Answer 1

15

Here's a "quick" profile loading 49 questions:

enter image description here

It looks like most of the time (4133.6ms) is spent rendering.
Loading only took 9.1ms.

If anything, rendering the response appears to be a (massive) bottleneck, which should be improved.

All those dark purple blocks show me this warning:

(60-80) ms Recalculate Stlye (jquery.min.js) Forced reflow is a likely performance bottleneck.

There are quite a few things that trigger a forced reflow, but I'm sure the rendering can be changed to trigger fewer reflows.

There appear to be 43 of those "narrow" columns, maybe only 43 questions got loaded, and 6 were deleted before I clicked the "load" button. If that's the case, that means there's a reflow for every single new question. That could possibly be improved by adding all new question to the DOM in 1 go, instead of one by one, which seem to be happening now.

As a bonus, a 251 questions profile:

enter image description here

(I've got exports of both profiles available, if a dev would like to take a look at them)

4
  • My bad, I thought it was the AJAX call causing the problem. It doesn't change the fact that more question are rendered than needed. (Since you should only be able to see 50 max per page).
    – Zenoo
    Commented Jan 31, 2018 at 15:51
  • @Zenoo: Reducing the amount of questions doesn't fix the rendering issue, though.
    – Cerbrus
    Commented Jan 31, 2018 at 15:53
  • @Cerberus : Indeed, but at least it will limit the loop to 50 elements max.
    – Zenoo
    Commented Jan 31, 2018 at 15:54
  • @Zenoo: My profiling session there took way too long to render 49 items ;-)
    – Cerbrus
    Commented Jan 31, 2018 at 15:55

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .