Web Performance - jQuery fetching of HTML, CSS, JS, and IMGs -


i have app 10 html, 4 css, 8 js, , 15 img (png/jpg) files. want make site responsive , fast (ie. great user experience).

therefore, on initial page load, browser cache every asset site asynchronously without 'browser busy'. according steve souders (google) need use xhr eval or xhr injection avoid 'browser busy'. see slide 23 of even faster web sites.

i know can use xhr eval or xhr injection javascript. can use html, css, etc?

i trying code (with jquery), can't quite work:

$.ajax({ url:"/blog", cache:true, datatype:"text" }); $.ajax({ url:"/about", cache:true, datatype:"text" }); $.ajax({ url:"/blog/main.css", cache:true, datatype:"text" }); $.ajax({ url:"/about/logo.png", cache:true, datatype:"text" }); $.ajax({ url:"/blog/social.js", cache:true, datatype:"text" }); 

am way off or right track towards cached site fast user experience?

before think of micro-optimizations, start macro-optimizations:

  • make sure gzip compression enabled on server.
  • combine , minify css , js files single files.
  • combine of small images single big image make sprite. reduce number of requests.
  • choose optimal format images , remove unnecessary metadata information save space.

Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -