4

My app is just 15 pages and does not contain a lot of code on the client side. The website is hosted with modulus from Amsterdam and I call it from Germany. It has an awful long loading time and I was the only one calling the website. The server stats: 154 requests transfered 9.14mb avg response 4.31ms

Timeline

Most of the loading time seems to be vendor.css and vendor.js. As well as the css and js of the application.

What I already do:

  • load css first
  • try to load not needed js later like socket.io, google analytics but it is an Angular App so I need some JS in the head
  • uglify & minify my JS & CSS
  • concat CSS, JS to reduce requests
  • use sprites for small images which are used twice+
  • load diff. image sizes based on the screensize
  • use angular template cache for HTML (this adds a bit to initial loading time)
  • and probably some things I forgot to mention

Question 1

Why is there a gap in the waterfall, sure these are external scripts but it could already load the images in that time.

Question 2

Will loading the external JS from CDNs reduce a lot of the loading time? I thought about s.th. like this: https://www.npmjs.com/package/gulp-cdnizer but I like it to have a similar prog. in dev and prod. Also my gulp processes are very complex, I really try to avoid restructuring too much there.

Question 3

How are things like gzip combineable with angular template cache?

Question 4

What else can I do to reduce the initial loading time,the loading time in the app is good.

Andi Giga
  • 3,744
  • 9
  • 38
  • 68
  • 5
    A good tool im currently working with: https://developers.google.com/speed/pagespeed/insights/ – Andi Giga May 07 '15 at 18:54
  • Can you verify that this delay is present for other users too? Maybe the issue is in your network? Also, if you were to GET the first css on the list directly, is it still 2.2s on average? – Roman Mik May 07 '15 at 19:03
  • If I use the mod.bz I get around 700ms-1s. If I use my custom domain I get around 250ms -500ms (mostly 350ms). I guess the mod.bz is a proxy on the domain, so there is one node more to go. I couldn't test it on a diff. network so far. If I test with incognito mode I'm also a lot faster but nobody surfs without any extensions. – Andi Giga May 08 '15 at 06:06
  • Take a look at this SO post: [Speed up angular2 application](https://stackoverflow.com/questions/42583421/how-to-compress-and-optimise-an-angular2-application) – HappyCoder Jul 05 '17 at 07:52

1 Answers1

2
  1. because your site will not load until the dom will be load because this is a single page application, without angular the page have no idea what image to load...
  2. YES! YES! YES! my dom load was arround 11 secs... my js aggregated file was 850K. with CDN my dom load was 2sec and the file was 250K (because good gzip)
  3. YES YES YES! will help a lot!
  4. use javascript aggregation to marge and minimize all your js to a single file (or 2 files). if you have a lot of files, separate to 2 files, required and extra. what you need to load and what can be loaded later...

good luck :)

ido niger
  • 86
  • 2
  • 6