Increase load time of webpage by shortening code.

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Increase load time of webpage by shortening code.

Post by shaunak1234 »

Hi there I have a website
http://wallpapers.everything.org.in
And due to loading of 60 images the webpage loading time has increased tremendously,
But I wanna load those images.
take a look at the webpage!

my php code is as below

Code: Select all

<html>
<head>
<title>Wallpapers.everything.org.in-download from thousands of wallpapers
</title>
<script type="text/javascript" src="crawler.js">
</script>
<link rel="stylesheet" type="text/css" href="all.css">
</head>
<body onLoad="init()">
<div id="loading" class="loading">
        <div class="backloading"> <img src="images/ajax-loader.gif" border=0></div></div>
<script>
 var ld=(document.all);
  var ns4=document.layers;
 var ns6=document.getElementById&&!document.all;
 var ie4=document.all;
  if (ns4)
 	ld=document.loading;
 else if (ns6)
 	ld=document.getElementById("loading").style;
 else if (ie4)
 	ld=document.all.loading.style;
  function init()
 {
 if(ns4){ld.visibility="hidden";}
 else if (ns6||ie4) ld.display="none";
 }
 </script>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=196287183727314";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fbbut">
<div class="fb-like" data-href="http://wallpapers.everything.org.in" data-send="false" data-layout="button_count" data-width="50" data-show-faces="true"></div>
</div>
<div class="title">
<img src="images/title.jpg">
</div>
<div class="lftadd">
<a href="http://www.gainmoneyfast.com/-53951/3876.htm" target="_top"><img src="http://www.gainmoneyfast.com/banners/banner_120x60_970610.gif" border="0" alt="Affiliate Program"></a></div>
        <iframe width="850" height="540" class="iframe" border="0" name="view" src="http://wallpapers.everything.org.in/main.html">
</iframe>
<?php 
ob_start();
$a = 1;
$b = 60;
//ConnectstoyourDatabase
mysql_connect("abc", "abcr", "abc") or die(mysql_error()); 
 mysql_select_db("abc") or die(mysql_error());
?>
<div class="c">
<div class="marquee" id="mycrawler2">
<?php
for ($a=1; $a<=$b; $a++)
{
$data = mysql_query("SELECT * FROM abc WHERE srno= $a" )
or die(mysql_error());
while($info = mysql_fetch_array( $data ))
{
Print"<a target='view' height='10' width='10' href='http://wallpapers.everything.org.in/images/".$info['Name']."'> <img src='images/".$info['Name'] . "' height='90' width='90'></a>";
}
}
ob_end_flush();
?>
</div>
<script type="text/javascript">
marqueeInit({
uniqueid: 'mycrawler2',
style: {	
},
inc: 5, //speed - pixel increment for each iteration of this marquee's movement
mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
moveatleast: 2,
neutral: 150,
savedirection: true,
random: true
});
</script>
</div>
<dim class="sidebar" >
<b class="welcomemess">Welcome Guest,</b>
</dim>
<dim class="rgtmenu">
<a href="http://wallpapers.everything.org.in/nature.html" style="text-decoration:none;color:#cc0000;">Nature</a><br>
<a href="http://wallpapers.everything.org.in/cars.html" style="text-decoration:none;color:#cc0000;">Cars</a><br>
<a href="http://wallpapers.everything.org.in/wild.html" style="text-decoration:none;color:#cc0000;">Wildlife</a><br>
<a href="http://wallpapers.everything.org.in/forest.html" style="text-decoration:none;color:#cc0000;">Forest</a><br>
<a href="http://wallpapers.everything.org.in/anime.html" style="text-decoration:none;color:#cc0000;">Anime</a><br>
<a href="http://wallpapers.everything.org.in/music.html" style="text-decoration:none;color:#cc0000;">Music</a><br>
<a href="http://wallpapers.everything.org.in/celebs.html" style="text-decoration:none;color:#cc0000;">Celebrities</a><br>
<a href="http://wallpapers.everything.org.in/game.html" style="text-decoration:none;color:#cc0000;">Game</a><br>
<a href="http://wallpapers.everything.org.in/bikes.html" style="text-decoration:none;color:#cc0000;">Bikes</a><br>
<a href="http://wallpapers.everything.org.in/divine.html" style="text-decoration:none;color:#cc0000;">Divine</a><br>
<a href="http://wallpapers.everything.org.in/scene.html" style="text-decoration:none;color:#cc0000;">Scenery</a><br>
<a href="http://wallpapers.everything.org.in/gadget.html" style="text-decoration:none;color:#cc0000;">gadgets/electronics</a><br>
<a href="http://wallpapers.everything.org.in/other.html" style="text-decoration:none;color:#cc0000;">Other</option><br><br><br>
<a href="http://wallpapers.everything.org.in/upload.php" style="text-decoration:none;color:#cc0000;"><input type="button" value="Upload"></a><br>
<a href="http://wallpapers.everything.org.in/report.html" style="text-decoration:none;color:#cc0000;"><input type="button" value="report a copyrighted image."></a>
</dim>
<dim class="rgtadd" >
<script type="text/javascript" src="http://www.gainmoneyfast.com/services/banner_rotator.php?a_aid=53951&a_bid=3787"></script>
</div>
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-26066258-2']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
</body>
</html>
User avatar
social_experiment
DevNet Master
Posts: 2793
Joined: Sun Feb 15, 2009 11:08 am
Location: .za

Re: Increase load time of webpage by shortening code.

Post by social_experiment »

Try a pre-loading script using Javascript; but imo 60 images will take time to download, even if you have a fast connection.
“Don’t worry if it doesn’t work right. If everything did, you’d be out of a job.” - Mosher’s Law of Software Engineering
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

whats the https thing can i display the page and simultaneously download images
User avatar
social_experiment
DevNet Master
Posts: 2793
Joined: Sun Feb 15, 2009 11:08 am
Location: .za

Re: Increase load time of webpage by shortening code.

Post by social_experiment »

“Don’t worry if it doesn’t work right. If everything did, you’d be out of a job.” - Mosher’s Law of Software Engineering
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Increase load time of webpage by shortening code.

Post by Celauran »

60 separate queries? Why?

Code: Select all

<?php
for ($a=1; $a<=$b; $a++)
{
$data = mysql_query("SELECT * FROM abc WHERE srno= $a" )
or die(mysql_error());
while($info = mysql_fetch_array( $data ))
{
Print"<a target='view' height='10' width='10' href='http://wallpapers.everything.org.in/images/".$info['Name']."'> <img src='images/".$info['Name'] . "' height='90' width='90'></a>";
}
}
Also, it appears you're loading the full sized images and using HTML to display them as thumbnails. That doesn't seem particularly efficient.
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

what can I do I am a new bie?
How Can I have a single query?
how can I load images in small size
User avatar
social_experiment
DevNet Master
Posts: 2793
Joined: Sun Feb 15, 2009 11:08 am
Location: .za

Re: Increase load time of webpage by shortening code.

Post by social_experiment »

Celauran wrote:Also, it appears you're loading the full sized images and using HTML to display them as thumbnails. That doesn't seem particularly efficient.
@OP You can start by using smaller (actual smaller images) thumbnail images, your current 'thumbnails' are not 'thumbnails' which still makes the page loading take long.
“Don’t worry if it doesn’t work right. If everything did, you’d be out of a job.” - Mosher’s Law of Software Engineering
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

I cannot resize all the images as they will occupy much larger space, other option?
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Increase load time of webpage by shortening code.

Post by Celauran »

shaunak1234 wrote:How Can I have a single query?

Code: Select all

SELECT `name` FROM abc ORDER BY srno ASC LIMIT 60
Although maybe loading fewer than 60 at a time would also be a good idea.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Increase load time of webpage by shortening code.

Post by Celauran »

shaunak1234 wrote:I cannot resize all the images as they will occupy much larger space, other option?
Really, you'll have to. Thumbnails won't take up that much space and it will dramatically improve load time.
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

thanks guys
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

I Have got an idea can I show a button to the users which says click to view next 50 images and on click it will load next 50 images to display
Last edited by shaunak1234 on Tue Nov 08, 2011 7:22 am, edited 1 time in total.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Increase load time of webpage by shortening code.

Post by Celauran »

That should return 60 results. What does mysql_num_rows() give you? Post the rest of your code if you want us to take a look.
shaunak1234
Forum Newbie
Posts: 13
Joined: Thu Nov 03, 2011 12:24 am

Re: Increase load time of webpage by shortening code.

Post by shaunak1234 »

Celauran wrote:That should return 60 results. What does mysql_num_rows() give you? Post the rest of your code if you want us to take a look.
sorry it did I have changed the post
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Increase load time of webpage by shortening code.

Post by Celauran »

shaunak1234 wrote:I Have got an idea can I show a button to the users which says click to view next 50 images and on click it will load next 50 images to display
Sure. Simple pagination should do that. Define a number of images to display per page and use the current page number to generate your offset.

Code: Select all

$per_page = 10;
$offset = (intval($_GET['page']) - 1) * $per_page;
$query = "SELECT foo FROM bar WHERE something LIMIT $offset, $per_page";
Post Reply