473,405 Members | 2,287 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,405 software developers and data experts.

How to output a JPG/JPEG image in html with low quality for faster browsing?

I have like 50000 images on my server, and each image is about 7mb of size. I made a gallery script based on the famous html code for displaying image :
<img src="image.jpg" width="200" height="150">
Even after setting the width and the height, the image is till taking time to display, because it's always download the 7mb sized image.

So, I'm here to ask you, Experts, if there is any way to display these images in a form of thumbnail with a lower quality, so it can be displayed quickly. I would like to do that without creating thumbnails of those 50000 images.

I appreciate any help or idea from your behalf.
I hope you all find my question interesting and i hope that we can find out a solution for this problem.
Thank you very much.
Dec 3 '11 #1
5 3856
drhowarddrfine
7,435 Expert 4TB
No. The only thing you can do is have images resized smaller.
Dec 3 '11 #2
omerbutt
638 512MB
you can try this simple script if you have the jnow how of GD library

Using Imagecopyresized ()
Expand|Select|Wrap|Line Numbers
  1. <?php 
  2.  // The file you are resizing 
  3.  $file = 'your.jpg'; 
  4.  
  5.  //This will set our output to 45% of the original size 
  6.  $size = 0.45; 
  7.  
  8.  // This sets it to a .jpg, but you can change this to png or gif 
  9.  header('Content-type: image/jpeg'); 
  10.  
  11.  // Setting the resize parameters
  12.  list($width, $height) = getimagesize($file); 
  13.  $modwidth = $width * $size; 
  14.  $modheight = $height * $size; 
  15.  
  16.  // Creating the Canvas 
  17.  $tn= imagecreatetruecolor($modwidth, $modheight); 
  18.  $source = imagecreatefromjpeg($file); 
  19.  
  20.  // Resizing our image to fit the canvas 
  21.  imagecopyresized($tn, $source, 0, 0, 0, 0, $modwidth, $modheight, $width, $height); 
  22.  
  23.  // Outputs a jpg image, you could change this to gif or png if needed 
  24.  imagejpeg($tn); 
  25.  ?> 
  26.  
Using Imagecopyresampled ()
Expand|Select|Wrap|Line Numbers
  1. <?php 
  2.  // The file you are resizing 
  3.  $file = 'yourfile.jpg'; 
  4.  
  5.  //This will set our output to 45% of the original size 
  6.  $size = 0.45; 
  7.  
  8.  // This sets it to a .jpg, but you can change this to png or gif 
  9.  header('Content-type: image/jpeg'); 
  10.  
  11.  // Setting the resize parameters 
  12.  list($width, $height) = getimagesize($file); 
  13.  $modwidth = $width * $size; 
  14.  $modheight = $height * $size; 
  15.  
  16.  // Resizing the Image 
  17.  $tn = imagecreatetruecolor($modwidth, $modheight); 
  18.  $image = imagecreatefromjpeg($file); 
  19.  imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height); 
  20.  
  21.  // Outputting a .jpg, you can make this gif or png if you want 
  22.  //notice we set the quality (third value) to 100 
  23.  imagejpeg($tn, null, 100); 
  24.  ?> 
  25.  
optionally you an use phpthumb also see here
regards,
Omer Aslam
Dec 4 '11 #3
I still think the most optimal way is to generate thumbnails right after they're uploaded. Why? Because if you generate thumbnails on the fly, all the 7mb still have to be loaded into memory and considerable amount of processing has to be done each time a user views an image.
Dec 5 '11 #4
omerbutt
638 512MB
yes seoquake i agree ,
that is why i have added a link to phpthumb in the end , whatever h likes , choices he have.
regards,
Omer Aslam
Dec 5 '11 #5
Better way is that u can convert all these images in .png format.Because,Noone is going to use .jpg or .jpeg formats.
Oct 24 '13 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

3
by: Ming | last post by:
Hi All, I want to write a PHP webpage which allows people to upload images (no matter what formats) to me and at the same time converts any non-jpeg image to JPEG. Here's what I have: ...
2
by: Lucas Cowald | last post by:
Hi, Using ASP and VBScript. How to convert JPEG image into a binary data? Is it possible with a command from ASP / VBScript without having to put it into a database first? I want to take the...
2
by: Onwuka Emeka | last post by:
is there a way to reduce or modify the color depth of a jpeg image, i currently need to programatically change the color depth of a jpeg image from 24bits to 8bits. any help would be appreciated
1
by: spgedwards | last post by:
I am trying to run a basic script that displays an existing jpeg image and writes some text over it. Sounds simple, but I cannot seem to be able to colour the font correctly. In the example below...
6
by: RaulAbHK | last post by:
Dear all, I guess this is a basic question with an easy answer but I am a beginner and I would much apreciate your feedbacks. Let's say I have a library with some functionality to perform some...
0
by: nma | last post by:
Hiya, Can anyone help me in this..i'm stuck I have created a table in SQL server that contain field name (shotSelectedKeyfrm -int type, and imgSelectedKeyfrm-varchar(255) type) like below: ...
0
by: =?Utf-8?B?TWFyazEyMw==?= | last post by:
I have two pieces of VB.NET code below: a) Sends an email b) Returns a programmatically created jpeg image to a webpage. How can I embed the programmatically created jpeg into an HTML...
1
by: Puneeth kamath | last post by:
I am working on pdf to xml conversion. I achieved pdf to text by using pdf clown samples. Now I am able to extract the pdf to text and image as well. But the problem is,the saved image is...
2
by: santhanalakshmi | last post by:
Hi, I am running Apache and the Active Perl. In Apache, CGI folder, i had one JPEG image. I wants to display this JPEG image in my browser as the header. use CGI qw(:all); print...
0
HaLo2FrEeEk
by: HaLo2FrEeEk | last post by:
I've got an image that I want to load, it's a JPEG image and it has a solid background of color rgb(11, 12, 14). I want to make the background transparent and outpt the image as a PNG. I've tried...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.