which one is fasted. Need help.

[Funkerman88]

I've been doing performance optimization for our client. Used best practices and so on.

Though I have a difficulty I cant judge which one variant is better

legend: We have a a site with lots of Js in one bundle . We can control this bundle load order)


It can go after CSS
and be defered onLoad event


The problem is for me I cant judge what's better/ Results very confusing
chrome - http://www.webpagetest.org/video/view.ph...20c&data=1
ie 11 - http://www.webpagetest.org/video/view.ph...3fc&data=1

or Product listing page
ie11 http://www.webpagetest.org/video/view.ph...447&data=1

or this kind of page http://www.webpagetest.org/video/view.ph...782&data=1

[pmeenan]

Looks like a fe things need to get fixed with the test page before you focus too much on the front-end: http://www.webpagetest.org/result/140527...1/details/

- The 404's for the images. It's going to be a lot easier to look at the performance if the images are loading correctly.
- The first byte time is dominating the performance. Looks like the back-end is taking ~1.5 seconds. Granted, it's a demo site but you need to get the first byte times reduced significantly (particularly if there is no load on the demo server).

On the front-end:
- The custom fonts are really going to hurt your visual performance. At a minimum, try to put in a prefetch hint to at least get the browser started on fetching them before layout happens.
- It looks like you have 4 separate external css files and their loading is causing the render to block. If you can reduce it to one file (or even better, inline the critical styles for the above-the-fold) you should be able to shave another second or so off of the render time.

[Funkerman88]

(05-28-2014 12:05 AM)pmeenan Wrote:  Looks like a fe things need to get fixed with the test page before you focus too much on the front-end: http://www.webpagetest.org/result/140527...1/details/

- The 404's for the images. It's going to be a lot easier to look at the performance if the images are loading correctly.
- The first byte time is dominating the performance. Looks like the back-end is taking ~1.5 seconds. Granted, it's a demo site but you need to get the first byte times reduced significantly (particularly if there is no load on the demo server).

On the front-end:
- The custom fonts are really going to hurt your visual performance. At a minimum, try to put in a prefetch hint to at least get the browser started on fetching them before layout happens.
- It looks like you have 4 separate external css files and their loading is causing the render to block. If you can reduce it to one file (or even better, inline the critical styles for the above-the-fold) you should be able to shave another second or so off of the render time.

thanks for reply - that is how it looks on live http://www.webpagetest.org/result/140602...1/details/

1 - 404 errosr were cause demo environment ) )
2 - The funny thing with css bundle . We we got this project to tune up, there been already CSS 1 bundle .
what we did :
- that bundle has all css rules for the site . Se we simplified it and get rid of not used CSS for each page view type. We shaved from 85kb to 58 kb on start page ))

- the other thing - an avarage it took 850msec - 1.2 sec to get those 85kb to get that bundle
now. since we get smaller pieces- it gets from 450msec to 650msec to get CSS

For the fonts domain we used to have dns prefetches )