Following the best practices of storing images will make it easier to implement LibPixel's image API
LibPixel can access any image that is publicly accessible via a URL. This means that you do not have to shift your images to any special storage for them to be served with LibPixel’s image API. However, there are some practices related to image storage that should be followed so that you can smoothly integrate our CDN services.
There are some best practices that you should follow while managing your images on the server, which will help you whether you are using LibPixel or not.
As simple as that sounds, storing your images in a single directly will ease your development process by making it easier to build relative paths. Moreover, when you’re adding a source in your LibPixel account then you will need to add separate sources for different root directories.
Therefore, having one root directory where all your images are present will ease up your LibPixel’s image API’s integration and will generally smoothen your development process. Through our CDN, you will be able to access any of the images present in the subdirectories of the root directory as long as you point to the root directly correctly.
Gone are the days where you have to store multiple resolutions of a single image to benefit from improved SEO. Now, you can simply use our image CDN to present different variations of a single high quality image stored at one place on your server.
This will not only improve the delivery time of your images by using our top notch, highly available CDN that uses edge locations to optimize delivery but will also cut down on your storage costs by reducing the burden of storing multiple images.
This is self-explanatory, it is advisable that you store your images named while following the best practices. This means that you should avoid special characters, white spaces and other symbols that might break your HTML code.
Here’s a list of symbols that you should avoid while naming your files. Using these symbols/characters can result in 404 errors while serving your images through our image API. Here are some example file names that should be avoided:
image#3&giraffe%photo.jpg ❌
nice/sunset:dallas.jpg ❌
!cars honda @parking.jpg ❌
Adding white spaces in file name, will lead to unexpected outcome. The browser will read the above example as:
!cars%20honda%20%40parking.jpg ❌
giraffe-standing.jpg ✔️
boy-eating-icecream.jpg ✔️
LibPixel offers image delivery through our high performance CDN that ensures the images get delivered faster than they would if you were serving them yourself. There’s also a downside of the image CDN, which is that your sources might get cached and updating them might take some time to show results.
To tackle this issue, you can use the Cache-Control: max-age headers. We use the high-performance AWS CloudFront CDN to manage your load. The CDN allows you to set the TTL value of your resources by setting the header. The default TTL time of a resource is set to 86400 seconds, which is one day.
You can adjust the TTL value by setting the Cache-Control: max-age headers to meet your needs. Finally, if you want to flush the whole cache to post your changes immediately then you can just send us a message and we will perform the flushing for you.
In this article, we discussed the best practices of organizing your images on the server and managing the cache of your resources on the CDN. Both topics are important for getting started with LibPixel’s image CDN. The next step is to signup and try out our image API for free.
To learn more, read our quick start tutorial, which takes you step by step to your first image being served by LibPixel. After that, check out our image API’s documentation, which covers all of the provided methods and examples of their usage.
