見る人は、時間がかかるのが嫌いだ。

うれしがっていろいろやってると、とても表示に時間がかかることに気づいたのでメモ。
Web Page Analyzer - free website optimization tool website speed test check website performance report from web site optimization

jQuery使わないとき

Connection Rate	Download Time
14.4K	32.88 seconds
28.8K	17.14 seconds
33.6K	14.89 seconds
56K	9.49 seconds
ISDN 128K	3.88 seconds
T1 1.44Mbps	1.62 seconds

jQueryを使ったとき

Connection Rate	Download Time
14.4K	126.11 seconds
28.8K	65.26 seconds
33.6K	56.56 seconds
56K	35.70 seconds
ISDN 128K	13.98 seconds
T1 1.44Mbps	5.23 seconds

以下のスクリプトと、付属のスタイル。

	<script src="/js/jquery.js"                 type="text/javascript"></script>
	<script src="/js/jquery.dimensions.js"      type="text/javascript"></script>
	<script src="/js/jquery.gradient.js"        type="text/javascript"></script>
	<script src="/js/ui.tabs.pack.js"           type="text/javascript"></script>
	<script src="/js/jquery.jcarousel.pack.js"  type="text/javascript"></script>
	<script src="/js/jquery.flatheights.js" type="text/javascript"></script>
	<script src="/js/jquery.easing.1.3.js" 		type="text/javascript"></script>
	<script type="text/javascript">
	
	(function($){
	
	   jQuery(function(){
	   
		jQuery('#mycarousel').jcarousel();
		jQuery('#mycarousel2').jcarousel();
	   
			jQuery('div[class^="toggle"]').hide();

			
		//h2 idと同名のクラスをトグル
	
			jQuery('h3[id^="toggle"]').css("cursor","pointer").click(function(){
			var target ="."+jQuery(this).attr("id");
			jQuery(target).toggle("slow").css("background","#fff");
			});
			
		//スクリプト、グラデーション
			
			/*jQuery("#header").gradient({
			from:      'eeeeff',
			to:        'ffffff',
			direction: 'horizontal'
			});
			
			jQuery("#footer").gradient({
			from:      'ffffff',
			to:        'eeeeff',
			direction: 'horizontal'
			});*/

			
			jQuery("h3").gradient({
			from:      'eeeeff',
			to:        'ffffff',
			direction: 'horizontal'
			});
			
			
		//指定したノードの高さをそろえる
		jQuery('.calendar-layout li').flatHeights();
		
		
		
		//インクルード
		jQuery(".calendar-layout strong").click(function(){

        var target = jQuery(this).attr("id");

        jQuery("#demo").empty();
        jQuery("#demo").append("<iframe src=\"http://example.com/" + target + ".html\" frameborder=\"0\" height=\"940\" width=\"800\" allowtransparency=\"true\"></iframe>");
        });

		jQuery('.inline_list li').flatHeights();
		jQuery('.inline_list').after("<br style=\"clear:both\" />");
	
		//カルーセル　イメージクリックアクション
		  
			jQuery("#mycarousel img").click(function(){
			
				var file 		= jQuery(this).attr("alt");
				var directory 	= jQuery(this).attr("id");
				jQuery("#result").load("goods/" + directory + '/' + file);
			});
		  
			

		//ページを開いたときの、タブ位置指定
		
		jQuery('#tab > ul').tabs();
			
		//style
		
		jQuery("table tr:odd").css("background","#ccf");
		jQuery(".submit input")
		.hover(function(){jQuery(this)
		.css("background","#ccc")},function(){
			jQuery(this).css("background","#eef");
		});
		
		jQuery("hr").wrap("<div class=\"hr\"></div>");
		
		//UA機能　補完
				
		jQuery("blockquote").prepend("<div style=\"width:1em;font-weight:bold;float:left;\">&quot;</div>");
		
		//cite属性の明示
		jQuery("blockquote").each(function(){
        var cite  = jQuery(this).attr("cite");
		if( cite ){
	
        jQuery(this).append("<p style=\"text-align:right;\">引用元：<a href=\"" + cite +"\" onclick=\"this.target='_blank';\" onkeypress=\"this.target='_blank';\">" + cite + "</a></p>");
		
		}
		
        });
		
		

		
		//load top image
		
		jQuery("#header-image").append("<img src=\"/text2html/document/images/top.gif\" />");
		
		
	});

	
			
	})(jQuery);
	</script>