Tips to save up our page load time [duplicate]

Question

My Question:What are the best possible ways to shave up those unnecessary kbs and make page load Faster.What all optimization practices+coding practices(in js,php) if performed can make your page lighter.

Why I asked this:I read this article on jquery.js vs jquery.min.js usage.I thought lot of people use it without knowing the meaning of it.I am basically in to making ad units on android and ios phones.So in my field saving up every single kb becomes very critical. I have recently started using jquery.min instead of plain javascript.But again that increases the overall kbs size.The big daddy google keeps track of this aspect in their page rank philosophy.So this question becomes even more important to be in top most searches.I did search google but no link came up with some solid answers.

I was wondering what should people do to make their web page lighter on mobile as well as tablets and pc browser other than using minified version of any js library. At some point of time every javascript coder must be thinking of this question.

Answer 1

To take advantage of parallel download and more often cache, use a CDN as google:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

If your concern is just the size of the file, build your own jquery version removing what you don't currently use: { you could still put this file on an external server for paralell download }

jQuery Builder (e.g) (28.35 Kb minified using just ajax and css modules)

OUT OF TOPIC

Now, concerning performance for animation, if you are using jquery for that purpose you should have a look to GSAP jquery plugin which can improve performance to 20X: jQuery GSAP

See the speed test page to compare between libraries: http://www.greensock.com/js/speed.html

Answer 2

You would want to research WPO (Web Performance Optimization) and/or FEO (Front-End Optimization).

It's old but it still holds true today: http://stevesouders.com/hpws/rules.php

Rule 1 - Make Fewer HTTP Requests
Rule 2 - Use a Content Delivery Network
Rule 3 - Add an Expires Header
Rule 4 - Gzip Components
Rule 5 - Put Stylesheets at the Top
Rule 6 - Put Scripts at the Bottom
Rule 7 - Avoid CSS Expressions
Rule 8 - Make JavaScript and CSS External
Rule 9 - Reduce DNS Lookups
Rule 10 - Minify JavaScript
Rule 11 - Avoid Redirects
Rule 12 - Remove Duplicate Scripts
Rule 13 - Configure ETags
Rule 14 - Make AJAX Cacheable

Then there's Yahoo's rules: http://developer.yahoo.com/performance/rules.html

And of course google's recomendations: https://developers.google.com/speed/docs/best-practices/rules_intro

Finally test your site with http://webpagetest.org