website loads slow

[tomByrer]

Unfortunately https://nerv.aotu.io/ loads very slow on my machine (i5 CPU, 20Bb RAM, SSD drive, Google Fiber internet in Kansas City, MO, USA, which is very fast). I have visited your website 7 times the past day in 4 browsers, and, always the first load is slow.
Most other websites, & all web developer sites load much faster. I did a test on a web loading testing platform:

https://www.webpagetest.org/result/180112_AW_4e2ad73a0385a06698d7d674bbda92ef/

Most tests are near 100% which is good, but 7 seconds is slow for a minimum website.

The network graph in Chrome DevTools indicate the index.js is too slow to load:

I have not read your code to see what is slowing down your site, but looking at this test:
https://builtwith.com/?https%3a%2f%2fnerv.aotu.io%2f
indicate that your CDN is Cachefly . Perhaps they are causing the slowdown; live GZip re-compression for every request maybe?
I would switch to CloudFlare; they have 119 POPs (including inside China) & are usually the fastest.
(Note: I volunteer for jsDelivr, which runs cdnperf.com and uses CloudFlare).

Also, allowing all the other website assets to load while the index.js is loading will help. It is best practice to 'server side render' everything you can, so you do not need index.js to show most of the website.

I hope the webiste will be faster, so more people will learn of your project!

[luckyadam]

Hello,I have deploy the assets files to our company's CDN, maybe can be faster.Can you try it again?Thank you

[tomByrer]

A big improvement, thank you! Seems twice as fast!

But it is still 3.5 seconds until the index.js is fully loaded and executed, which seems to block the page.

Since index.js is a blocker for the HTML to render, I'm wondering if splitting up the bundle into a smaller JS files would help for an easy solution.

Best solution is to pre-render everything as plain HTML, and use only minimal JavaScript for tracking, etc.

[luckyadam]

@tomByrer Good idea!I will upgrade our build tool to split the index.js file!
Thank you!

[tomByrer]

Found some more specific tips:
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/javascript-startup-optimization/

Since you have only 1 route now, I'd suggest loading in the header and 'Features' section first, then load in the other sections after.

[luckyadam]

@tomByrer I have split the index.js to multiple files and lazyload the files,maybe faster now.Can you try it again?
Thank you again!

[tomByrer]

Yes, better, thank you! I can see the lazyload as I scroll down also.

The spinner is a good idea to let people know the webpage is building.

[Butafly]

my site witch is github hosted have to reload the page several times so that it loads the whole images and files, please give me an advice because all day i have that issue
you can check the url into my github profile or