Page Flash when changing pages
April 26, 2016 12:00 AM
In a published course, for example:
http://community.trivantis.com/wp-content/uploads/lectora-published/301466/302301/index.html
In Chrome and IE, the pages flash when going to the next page and then then the next page.
In Firefox the interface remains drawn on the screen and only the page content is replaced.
The Firefox behavour is the desired behavour that I am looking for.
Is there any settings, reccomended way of building the corse, etc that will show a more smooth transisition when navigating between pages in all browsers?
undefined
Discussion (3)
To be fair to Ian, he linked a course built by Trivantis, not him.
Here's a similar conversation for reference: http://community.trivantis.com/forums/topic/page-flashing-when-navigating/
For starters you need to optimize your images better. You are using PNG when you should be using JPG. If you do not need transparency and have photo type graphics, use jpg and optimize them in a program like Photoshop. Depending on what version you are using use either save for web or export. NEVER just do a "save as". I took your 102KB img1.png and optimized it. It's now a 13.7KB JPG and you'll be hard pressed to see a difference. Times that by all your images and its a huge savings.
Another thing I noticed was there is an error thrown on the console when the page is looked at in dev tools."Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience" The 'detrimental effects' they are talking about are load times. I don't know enough about how this works with Lecotra exported material to comment, however maybe someone in Trivantis support can provide an explanation of whats going on there.
I read a post recently that had some questionable stuff in it about reducing load times. The single biggest cause of slow load times is caused by the need for the page to make multiple requests to the server for information. This can be caused by using too many separate external javascript files (combine them when possible) and too many cascading style sheets (again, combine them when possible). some of this may be beyond your control so do your best with image optimization.
Also, there is a phenomenon called fouc or Flash Of Unstyled Content that occurs when the browser tries to render a page before all the style information is received. It has existed for a long time. Here is a good article on trying to prevent it if anyone is interested.
One last thing. I like the clean simple layout. The colors and all really fit with the subject. Well done.
DRS

Discussions have been disabled for this post