Cloudinary Blog

How to Compress Video Size Automatically With One Line of Code

How to Compress Video Size Automatically With One Line of Code

As technologies advance apace, the volume of online videos continues to increase fast. Instagram, WhatsApp, Facebook, YouTube, TikTok are just a few platforms among many that massively share and distribute videos around the clock.

When compared to other media files, such as those for audios and images, video files are larger, consuming a lion’s share of data bandwidth. Compressing video files enables faster downloads, uploads, and streaming online.


Sign up for Cloudinary free today!


For people in remote areas and developing regions, where download and upload speeds usually range between 720 kb and 1.5 Mb per second, compressing video files is not optional—it’s mandatory! To do that and deliver videos of a smaller file size to users with Cloudinary, you as developers can choose either of these two ways:

  • Compression as part of the upload request
  • On-the-fly compression during delivery

Update
On October 29th, 2019 Cloudinary released the new auto-quality setting for content-aware video compression. By using the q_auto parameter, Cloudinary intelligently encodes video using the most optimized settings, for the best trade-off between file size and quality. Read more.

Compression As Part of the Upload Request

This technique involves applying compression transformation to the videos during upload before storage. Cloudinary makes the process a walk in the park with just one line of code in Ruby, Python, or PHP:

Ruby

Copy to clipboard
Cloudinary::Uploader.upload("cool_video.mp4", :resource_type => :video, :quality => 60)

Python

Copy to clipboard
cloudinary.uploader.upload("cool_video.mp4", resource_type = "video", "quality" = "60")

PHP

Copy to clipboard
\Cloudinary\Uploader::upload("my_video.mp4", [ "resource_type" => "video", "quality" => "60"]);

In the code above, you specify the quality parameter to manipulate the video’s quality and size before Cloudinary stores the video in the cloud.

Note
If you’re not sure what number to assign to the quality parameter, just type auto. Cloudinary then automatically adjusts the compression quality for your video by applying the optimal balance between the video’s file size and quality.

On-the-Fly Compression During Delivery

With this Cloudinary technique, you upload videos straight to the cloud and then apply the quality compression parameter when delivering them to users. You can also serve videos in the formats that pertain to the various web browsers and mobile devices.

You configure quality on a 0-100 scale. The higher the video quality, the larger the video size; the lower the video quality, the smaller the video size. To compress video size on the fly, adjust their quality parameter in a codeline. See the examples below.

Node.js

Copy to clipboard
cloudinary.video("dog", {quality: 50})

Java

Copy to clipboard
cloudinary.url().transformation(new Transformation().quality(50)).videoTag("dog");

Python

Copy to clipboard
CloudinaryVideo("dog").video(quality=50)

On-the-fly video compression through the URL

Copy to clipboard
https://res.cloudinary.com/demo/video/upload/q_50/dog.mp4

In q_50 in the above URL, q stands for quality; 50 is the number of your choice on a 0-100 scale. Front-end developers, you can drop those components in your app out of the box, like this: React.js

Copy to clipboard
<Video publicId="dog" ><Transformation quality="50" /></Video>

Vue.js

Copy to clipboard
<cld-video publicId="dog" ><cld-transformation quality="50" /></cld-video>

dog represents the name of the uploaded video, which is usually the public ID (publicId) on the Cloudinary storage.

Conclusion

Compress video size automatically with Cloudinary making media much more accessible. Furthermore, Cloudinary’s drop-in tools and services are effective, simple, and intuitive, saving you ample time to focus on your project.

For details, check out the following Cloudinary documentation:


Further Reading on Video Manipulation

Recent Blog Posts

Create Lightweight Sites With Low-Code and No-Code Technology

Consumers expect modern websites to be mainly visual. But, the more compelling and complex the related media is, the more data is involved, compounding the site’s weight. In today’s content-craving world, delivering unoptimized media can cost you because it leads to sluggish page loads, resulting in visitors abandoning your site in search of a faster alternative. In fact, a page load that takes more than three seconds can cause as many as 40% of your visitors to bounce. Given this competitive, digital-first environment, you can’t afford to lose page views, for time is of the essence.

Read more
A Blueprint for AWS-Secured Webhook Listeners for Cloudinary

tl;dr: An AWS-secured and optimized Cloudinary webhook listener for extending the Cloudinary service

Code: Github

A webhook is a communication medium for sending notifications from one platform to another about events that occurred. In place are user-defined HTTP callbacks that are triggered by specific events. When a triggered event takes place on the source site, the webhook listens to the event, collects the data, and sends it to the URL you specified in the form of an HTTP request.

Read more
New Accessibility Features for Cloudinary’s Product Gallery Widget

Cloudinary’s Product Gallery widget, which launched in 2019, has enabled many brands to effectively and efficiently showcase their products in a sleek and captivating manner, saving countless hours of development time and accelerating release cycles. By adding Cloudinary’s Product Gallery widget with its customizable UI to their product page, retailers reap numerous benefits, often turning visitors into customers in short order.

Read more
Why Successful Businesses Engage With and Convert Audiences With Visual Media

Most business buyers prefer to research purchase options online, as do many shoppers. No wonder online retail sales in the U.S. rose by 32.4% in 2020—an impressive gain of $105 billion.

For B2B and B2C businesses, text-heavy websites are no longer adequate in attracting shoppers. Instead, engaging visual media—spin images, videos, 3D models, augmented reality—are becoming a must for conveying eye-catching details and differentiators about products or services.

Read more
Making User-Generated Content (UGC) Shoppable With Cloudinary

User-generated content (UGC) is a powerful marketing tool. Not only does video complement marketing efforts for e-commerce by enabling customers to explore products in greater detail, but UGC also adds an element of trust. As a bonus, user-generated video is an exceptional opportunity for e-businesses to attract website traffic without their marketing team having to create promotional videos from scratch. User-generated content drives conversions and brand loyalty as a direct result of authentic interaction.

Read more