Low Quality Image Placeholder (LQIP)

LQIP

Endpoint URL
https://api.devweapons.com/lqip/
What does it do?

The LQIP API endpoint accepts a JPG or PNG source image and converts it to a low quality JPG/PNG image that can then be used as a placeholder during lazy loading.

Before LQIP conversion
Source JPG @ 52 kb
After LQIP conversion
LQIP @ 1.6 kb (1.1 kb gzipped)

The above image can leverage the LQIP functionality by using a <picture> tag and lazy loading:

<picture>
  <source data-srcset="lqip_example_source.jpg" />
  <img alt="LQIP" class="lazy" src="data:image/jpg;base64,BASE64 Encoded image here" />
</picture>

The above code leverages the https://github.com/verlok/vanilla-lazyload library.

Parameters
TypeParameter Name
filedata
Outputs
{"lqip":"data:image\/jpeg;base64,BASE64 Encoded Image data"}
{"error":"Missing file data."}
{"error":"The request method is must be POST."}
{"error": "Payload exceeds the size limit of 2M."}
{"error":"File must be of type jpg or png."}
{"error":"Error connecting to the database."}
Code Examples
curl https://api.devweapons.com/sqip/ -F "data=@/path/to/image.jpg"
$endpoint = 'https://api.devweapons.com/lqip/';

$file = new CURLFile('/path/to/image.jpg');

$curl = curl_init($endpoint);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($curl, CURLOPT_POSTFIELDS, ['data' => $file]);
$response = curl_exec($curl); 
curl_close($curl);
Integrations