I am new to JavaScript.
Here is the HTML code from my .php page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<meta name="Description" content=" " />
<meta name="Keywords" content=" " />
<?php include './thumbsup/init.php' ?>
<?php echo ThumbsUp::css() ?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<?php echo ThumbsUp::javascript() ?>
<script type="text/javascript" src="/menu/tab-nav.js"></script>
<link rel="stylesheet" type="text/css" href="/menu/style.css" />
<script type="text/javascript">var switchTo5x=true;</script><script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script><script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
<meta content="http://www.likedislike.tk/img/Desert.jpg" property="og:image"/>
</head>
<body>
<img src="img/smalllogo.gif" width="50" height="67" /><img src="img/like,dislike,what-you-think.png" width="125" height="50" />
<!-- SIDE NAVIGATION -->
<div id="tab-nav-3" class="tab-nav">
<ul>
<li>
<a href="#" class="Arrow"> </a>
<ul>
<li>
<div align="right" style="float:right; margin-right:7px;">
<span>
<a href="http://www.99points.info/" class="small button TabAddNew">
99 Points
</a>
</span>
</div>
</li>
<li>
<div align="right" style="float:right; margin-right:7px;">
<span>
<a href="http://www.99points.info/" class="small button TabAddNew">
PHP
</a>
</span>
</div>
</li>
<li>
<div align="right" style="float:right; margin-right:7px;">
<span>
<a href="http://www.99points.info/" class="small button TabAddNew">
jQuery
</a>
</span>
</div>
</li>
<li>
<div align="right" style="float:right; margin-right:7px;">
<span>
<a href="http://www.99points.info/" class="small button TabAddNew">
Codeigniter
</a>
</span>
</div>
</li>
<li>
<div align="right" style="float:right; margin-right:7px;">
<span>
<a href="http://www.99points.info/" class="small button TabAddNew">
Tutorials
</a>
</span>
</div>
</li>
</ul>
</li>
</ul>
</div>
<!-- SIDE NAVIGATION -->
<br />
<br />
<center>
<img src="img/Desert.jpg" alt="desert" width="300" height="400" align="middle" />
<br />
<?php echo ThumbsUp::item('test3')->template('thumbs_up_down') ?>
<?php echo ThumbsUp::item('test3')->template('mini_poll') ?>
</center>
<style type='text/css'>@import url('http://getbarometer.s3.amazonaws.com/assets/barometer/css/barometer.css');</style>
<script src='http://getbarometer.s3.amazonaws.com/assets/barometer/javascripts/barometer.js' type='text/javascript'></script>
<script type="text/javascript" charset="utf-8">
BAROMETER.load('rSR42kS5mkSjZ55nSYmc7');
</script>
<script>var options={"publisher":"81cbe826-100d-469c-9e6f-5705f10c7db0","ad":{"visible":false,"openDelay":"5","closeDelay":"0"},"livestream":{"domain":"http://www.likedislike.tk"},"ticker":{"visible":false,"domain":""},"facebook":{"visible":true,"profile":"http://www.facebook.com/pages/LikeDislike/227916660563617"},"fblike":{"visible":false,"url":""},"twitter":{"visible":false,"user":"sharethis"},"twfollow":{"visible":true,"url":"http://twitter.com/#!/LikeDisliketk"},"chicklets":{"items":["facebook","twitter","gbuzz","email","sharethis"]}}; var st_bar_widget = new sharethis.widgets.sharebar(options);</script>
</body>
</html>
Now as you can see there is more than one HTTP request because of all the .js files.
Now is there is any way to upload this on code Google? and combine them together.
I know I can host it on code Google project but this is what I got in FAQ http://code.google.com/p/support/wiki/DownloadsFAQ
“Are there any restrictions to how much bandwidth a download can consume?
No, but excessive bandwidth usage will be throttled and malicious usage will be blocked.We also discourage direct references to JavaScript files hosted on the download
service from HTML. This is because this path is not optimized for production web traffic.
As your traffic increases, you run the risk of experiencing failures on your current
requests. Instead, we encourage alternatives such as using the AJAX Libraries API
(http://code.google.com/apis/ajaxlibs/) which have better latency/scalability
characteristics for such scenarios or hosting the file on your own server.BAD CODE. DO NOT DO THIS!
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>
EXCELLENT
<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1");
</script>
OK
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script> "
So how do I get this kind a link http://ajax.googleapis.com/ajax/libs/myfile.js
I want to make my site faster
Feel free to shoot some of my mistake 🙂
I am only 13 .
Thanks..
The Google Library API only hosts very popular libraries – it’s not a service that you can upload your own code to. You can view all the libraries they supply here.
If your page load is slow, are you sure that the javascript load time is what is causing a slow page load? Before performing any optimisation, I would encourage you to measure your page load to find out which part is the slowest (server code, Javascript load, image load, page rendering, etc). As already mentioned, Google’s Page Speed tool might be a good choice (I haven’t used it, although it looks pretty awesome).
If you decide you do want to combine your javascript files, you could use minify to do it. Additionally, if you’re worried about javascript load time, the answers to this question and the beginners guide found here could help you.