Just a side note, but I recently remembered that XenForo has always had a loading slider. I’m glad to see that Discourse has something similar now. 
I’m wondering which will be much annoying when has poor network.
¡Great! 
1개의 좋아요
You can simulate poor network conditions using the f12 console in Chrome, if you want to.
4개의 좋아요
Update on iPhone 6s:
Looking very good with Dark theme now and many other themes on mobile.
Well done!
Update on Desktop:
Load slider still barely visible on Chromium with 27" and 34" ROG monitors.
Can we have a theme option to enable/disable based on mobile/desktop?
1개의 좋아요
Really good option. I can repro this if using facebook login. It seems this cause this url parameter #_=_
4개의 좋아요
I’ve found disabling the discourse-topic-list-previews plugin fixes all the issues with the Loading slider, as soon as I re-enable it the problem returns.
We’re not using any 3rd party logins, so it looks like this may be a separate bug (or somehow connected?)
Edit: In fact with both plugin’s enabled, the page only remains foggy on topics where discourse-topic-list-previews has found an image to replace the default one…and the categories page.
2개의 좋아요
Following up on testing on mobile and desktop with many themes, it seems to be that something like this gives a nice result for this awesome slider:
height: 4px;
@media only screen and (min-width: 960px) {
height: 7px;
}
Adding a single pixel (from 3px to 4px) to the default looks great on mobile; and on bigger desktop screens over 5px looks nice, but I settled on 7px for now
Will work on this a bit more as I have time, testing with various themes on “big” desktop and on my iPhones.
1개의 좋아요
Can I go back on the first part of this please? Having tried it out on desktop, the fading out is more irritating then the slider. I think it’s because when I click on a link to page B, I expect page A either to disappear straight away (as Discourse used to do) or stay there until B appears (as with web pages).
3개의 좋아요
Hello, you can use this for disable opacity. Create a new component in admin and add this to common section.
body.loading #main-outlet {
opacity: 1 !important;
}
5개의 좋아요
But at that point, what’s the value of this over the spinner? Just to see a loading slider?
2개의 좋아요
This is just disable the fading effect. It was the first version. Only top slider without fade effect.
2개의 좋아요
Sort of …
The first iteration was … no effect at all so you did not get any visual feedback after clicking a link short of slider, this was not ideal.
I am kind of on the fence on having the opaque page vs the blank page on click. I do agree it can be a bit distracting, maybe fade to 0 on click is better… not sure.
6개의 좋아요
Yes I think so maybe… It’s really hard… Maybe changeable effects would be good for everyone. 
Personally I really like it with this fading effect also.
The only problem with 0 opacity is at this point this only affect to main-outlet. The header and below-site-header still visible.
1개의 좋아요
I guess articulating my personal pain with the fade (at least on desktop) @awesomerobot / @david
I find it very very hard to read the faded text, so now every transition my brain is being forced to read faded text for a split second and it is a bit tiring.
Maybe if it faded to nothing it would be better, I do not know. Part of the problem is also that I am 250ms away, so at a minimum I will spend about 300ms waiting which guarantees some time is going to be spent looking at faded letters.
12개의 좋아요
FWIW,
I commented out the body transition (the fading text) and I think it looks OK (and maybe feels faster) when there is no body transition. Six one, 1/2 dozen of the other…
// body #main-outlet {
// transition: opacity 0.2s ease;
// }
// body.loading #main-outlet {
// opacity: 0.2;
// transition: opacity var(--loading-duration) ease;
// }
2개의 좋아요
Cheers Don, that’ll do 
2개의 좋아요
Yes, on mobile I thought the fading improved the slider, but I didn’t have a good look on desktop before fading was introduced. (On desktop I found the fading irritating.)
