Codeigniter dompdf image not rendering - codeigniter

I am finding problem in using dompdf with codeigniter, in rendering the image.
Actually my requirement is as follows:
User fills a given form.
He clicks ab button to print the form.
At the same time when he print the form, a pdf version of that
from is to be sent to user.
I am using dompdf for that. It works well, but the logo which is an image is not displayed in view and also in rendered pdf file.
I googled for that, and found that image path should be wrt server and not wrt application.
eg. my image path is /var/www/my_system/images/logo.png.
But it didn't visible. It shows fails to load URL.
I am using dompdf-0.5.2 version.
Please suggest.
Any help would be greatly appriciated.

Your issue appears to be related to the PHP memory limit. You could try increasing the memory limit to prevent issues in the future.
Some image operations can be costly in terms of system memory. dompdf has to do a lot more processing with PNG to support the full feature set. The KB size of the image isn't the determining factor because the memory footprint has more to do with the dimensions of the image.
FYI, it always helps debugging PHP issues to be able to see any errors thrown.

Related

Website loads image with 1-2 second delay. Could I increase the performance somehow?

recently I made a website for my photography. htttp://www.simotamas.com
I am a newbie, so its not the best site but it works fine for me, I got only one problem, when a site is loaded on a device for the first time, the gallery loading time takes up to 1-2 seconds.
Could you guys please check if I mess up something with the code?
Or should I made the pictures even smaller?
Any way I could increase the loading performance.
I would be really thankful for any advice.
Some points you can consider
Use thumbnails for preview (low resolution) , while clicking load actual image.
Load images of only visible part first then load the images in bottom. (May affect user experience)
if you have cpu power , use any libraries like cache tools or compression tools like
https://nielse63.github.io/php-image-cache/ . benchmark it carefully.
use gzip if you are not using gzip compression for your server.
The fact your website doesn't wait for the image to load is considered a plus (look into asynchronous web page content loading for a good read) that said you should compress your images before uploading them.. tinypng.com is a nice tool for it... But if it's a photography website doing so would reduce picture quality... Try to play with Photoshop save settings to find your ideal compromise between quality and size with respect to "memory" size... Pictures are heavy.. high definition and resolution will obviously result in heavier files to download
Update: another thing you could do is actually display (smaller) thumbnail and only load the full picture on request. I.e: user clicks and image opens in new tab
It would help if you create smaller thumb versions of your images so the browser can initially load these ones for the overview and no need for scaling way to big images down while rendering the page. An image should always be downloaded in the dimension it's going to be presented.

Laravel blade. Best way to show an image size according to the size of the screen

For each record, I have two images, small and large size. What is the best way to show an image size according to the size of the screen?
I know I can use css and mediaquery and show the small or large image using a div display none / block, but in this way, I understand that the user has downloaded both images even if they are not displayed, is that correct? Then, the page load increases. If so, what is the best option to do this?
For this problem the most efficient way is using the User-Agent to detect if a client is desktop, tablet or mobile.
I prefer to use Mobile_Detect or jenssegers/agent (based on Mobile_Detect).
Edit
Recently I installed the Google Pagespeed Module on my server. There is a filter, resize_rendered_image_dimensions, that returns images with sizes of the current client view (exactly what you are looking for).
Some other implementation would be lazyloading with Javascript and adding dimensions to the requested url depending on the viewport sizes.

Piranha CMS disable image resizing

I'm currently building a website with Piranha CMS MVC.
I noticed when I upload an image, the quality gets significantly worse.
I use this to load the image on to my page:
<img class="fullwidthimg" src="#UI.Content(Model.Regions.image.Id)" alt="#Model.Regions.image.Name" />
I'm familiar with HTML/CSS/JS but .NET is still quite new to me.
I was unable to find a solution in the forum or on the Piranha website.
I had the same issue, until i went poking around in the source. I found in the Content class there is a method called SetFileMeta that is used to resize the image.
What I found was a system setting being used as the max width. You can find the setting under System -> Parameters -> IMAGE_MAX_WIDTH. Increasing this number will increase the max width of the image, however, if you set the value to zero, the image will not be resized when it is uploaded.

CakePHP dompdf image crash

Whenever I try to insert an image into a PDF, the whole PDF file crashes. (Google Chrome says, 'Failed to load PDF document', and the network response is empty.)
I am using the dompdf plugin for cakephp, and the error is definitely not due to dompdf not finding the images. When the source attribute points to a non-existing image, it just shows a square rectangle. When, on the other hand, the path is correct, or I provide the source using the 'data:…;base64,…' notation, the whole PDF crashes.
I have increased the maximum resolution to 300dpi in Config/dompdf.php , but it still didn't work. Any ideas?

How to improve performance in image loading on web application?

I have a web application running on local host. The requirement is to load multiple rectangular jpg images (96 images, average 7k in size each) and show on home page when it runs. Images are showed in a grid of 8x12 rows/columns. I am loading image by setting the 'src' attribute of the 'img' in javascript. The url assigned to the 'src' attribute is same for all images but the image id is different. Images are loading but the main issue is that they are not loading very quickly and they are some what loading in a sequence means 1,2,3,4... and so on but some images are not loaded in sequence. I want to improve the performance of this page. I have tried the figure out the timings at different points like:
When call is originated form client (image src attribute is set)
When server is receiving call. (the page on server which serve individual image)
When server is about to return the image.
When on client side image is received/showed (image loaded event called in javascript)
It turned out after looking at the collected data that main time is lost between 1 and 2 above that is between the client side call is originated and server is receiving call for a particular image.
I have also tried setting parameters like maxWorkerThreads, minWorkerThreads, requestQueueLimit and maxconnection in machine.config but no significant improvement yet.
Can someone please help me in this situation as i am stuck here since many days and i am really short of time now. Desperately needs to improve the performance of these images loads.
Thanks in advance.
Since you stress the lack of time, I would advise you to try a jQuery plugin that loads images on demand. The gallery in which you load the pictures, does the user scroll in it? Or is it 1 big field?
If it's a gallery the user can scroll in, I'd strongly suggest you take a look at lazyload. What this plugin does, is it fetches the image only when it is needed. As long as it's not on the screen, it will not be loaded. For a brief example, have a look at this demo.
I hope this can help you out.

Resources