ImageEngine vs imgix — Ease of Use and Features Compared
This is part one of a comparison between two similar services for optimizing images; ImageEngine and imgix. You’ll find part II here.
The main benefit of image CDNs such as ImageEngine and imgix is the ability to automatically optimize all image content across your website, without having to get bogged down in responsive syntax or manually optimizing images using design software.
With a singular focus on optimizing image content and speeding up delivery, there is a lot of overlap. However, as this comparison will review, there are some potentially game-changing differences between the approaches and priorities of these two competitors.
To illuminate these differences, we’ll take a look at what you can expect from the user experience as well as the features of each image CDN.
Setup and Ease of Use
It’s probably a safe assumption to make that you want to spend as little time and effort optimizing image content, and more focusing on your website and core business.
To sign up with imgix, you merely have to provide basic information, verify your email address, and create a password. And, you’ll be good to go.
From there on, you need to create a source that will be a link to some form of online storage where imgix will locate the original master images to optimized and serve on your site.
This is also a simple process, which involves:
- Setting an imgix subdomain, for example, https://myimages.imgix.net
- Choosing the appropriate source, such as Amazon S3, Google Cloud, a web folder, etc.
- Passing along your storage authentication details and folder path
Once these two steps are done, you’ll be able to serve optimized images via imgix on your website by using the imgix subdomain in your image URLs.
You’ll notice a familiar process when signing up with ImageEngine. To sign up with ImageEngine account:
- Create a user account with your email and a password, alternatively with your Github or Google account:
2. Next, create your first Engine by defining the origin of your images.
This can be a Google Cloud Storage or Amazon S3 bucket or any other publicly accessible web location. If you need help finding the origin your website uses, hit the “?” button on the right, enter your website URL, and scan your site. A few origins will then be suggested for you. If you’re still not sure, you can always skip this step and reach out to the customer success team.
ImageEngine will now create a subdomain for you where your optimized images will be served from. Like imgix, ImageEngine will automatically, pull, optimize, and start serving your images without any further setup needed.
3. After this, ImageEngine will provide you with the domain (Delivery Address) your images will be served from:
And, that’s all you need to do. Without any further configuration, you can already load optimized images simply updating your image URLs with your new delivery address on your website.
If you want to add more origins from the dashboard, you just need to provide the appropriate location and name it. If you want to add more delivery addresses, you just give it a .cdn.imgeng.in subdomain and select the appropriate origin to load images from.
In conclusion, both setups are quick and easy and will get you up and running in a matter of minutes. The method of changing your image URLs on your website to serve them via either CDN will be the same for both.
Since it powers most of the web today, it’s worth mentioning that ImageEngine has an official WordPress plugin. The plugin will automatically change your image URLs to deliver optimized images via your ImageEngine domain. The same goes for Magento.
Unfortunately, there is no official plugin for imgix at this time. While I successfully used the Media Cloud plugin, it does require a significant amount of extra setup (including registering for Amazon S3 or Google Cloud). Using third-party tools may also leave you stranded in support no-man’s-land. Fun-fact: you can also use ImageEngine’s official ‘Image CDN’ plugin to configure your site for imgix.
Dashboard
When it comes to the dashboard and user experience after signing up, both platforms provide an extremely simple and easy to navigate UI. This is one advantage both imgix and ImageEngine have over other DAM platforms that also offer Image optimization, such as Cloudinary.
Here’s the view you’ll have when you log into the imgix dashboard:
And, here’s how it will look when navigating to one of your sources:
Using the navigation menu at the top, you’re only one click away from anything important, such as your sources, analytics, and tools where you can purge cache or sign image URLs.
ImageEngine’s dashboard is also incredibly easy to use. All your image origins and delivery addresses will be listed right on the main dashboard page:
Similarly, Analytics are within easy reach as is the ability to purge the cache.
One big difference between the two is the number of settings you can change for specific image delivery subdomains. imgix allows you to handily apply signed URLs to all the images in a source as well as to set your TTL, and that’s basically it.
In contrast, ImageEngine allows you to set a large number of settings that affect how the delivery address behaves, and that will apply certain default transformations to images according to a specified path. For example, you can set the TTL for the origin and browser, add URLs that are allowed to fetch images as well as apply size, quality, and formatting to images.
If you don’t wish to, or aren’t comfortable with, using directives in your image URLs manually, this can be a great way to set the default behavior for certain images.
Features
URL Parameters/Directives
Both imgix and ImageEngine allow users to specify settings for images using URL parameters. Both also cover all the essentials, such as cropping, sizing, compression, format, rotation, etc. You can find the entire list of ImageEngine directives in the documentation over here.
However, imgix allows users to make a huge number of other transformations as well as using a vast library of URL parameters. These include actions usually reserved for DAMs or image-editing software with visual interfaces, such as adding watermarks, masking, face detection, downloading, and additional adjustments, such as hue, saturation, gaussian blur, etc. In fact, imgix supports over 200 API operations.
While this is a great nice-to-have, many of these settings are probably better off used with a visual interface. If you want advanced transformations, you might be better off using a DAM like Cloudinary with an Image CDN in front.
Image Optimization
Probably our main reason for using an Image CDN is to speed up your website pages by optimizing your image content. First of all, both hosts feature automatic content negotiation. However, imgix will only automatically convert images to the WebP format when setting the “auto=format” parameter. Other formats, such as JPEG XR, PNG, GIF, JPEG 200, etc. can be specified manually.
On the other hand, ImageEngine can automatically format images to either WebP or JPEG 2000 (mostly for Safari browsers), depending on the context.
Both also natively support browser Client Hints as well as HTTP2 and HTTPS.
Both CDNs will also implement responsive image optimization for different devices on your behalf. While imgix is scarce with the details, ImageEngine employs WURFL device detection to get a fine-grained impression of the context images are viewed in.
This enables ImageEngine to fine-tune automatic image optimization by taking into account factors such as the device OS, browser, screen size, pixel ratio, and more. This adaptability will undoubtedly translate into future-proofing your website against new devices and software. On top of choosing the optimal format, ImageEngine also adjusts compression based on the device’s PPI (pixels per inch).
While simply swapping images to the WebP format can lead to 50% in payload reductions, ImageEngine claims to reduce payloads by up to 80% as well as delivering an outstanding 98% cache-hit ratio.
One of ImageEngine’s newer features is support for browsers with save-data headers switched on — reducing payloads even further for users with slow connections. Another relatively unique characteristic of ImageEngine is the ability to automatically format animated GIFs in the aWebP or MP4 format.
Both platforms also have impressive infrastructure backing them up. ImageEngine operates out of 20 PoPs spread all over the globe, while imgix also has ubiquitous reach thanks to its upstream CDN provider, Fastly. Both CDNs built their image optimization into the logic of their edge server.
You can find a detailed comparison of the characteristics and features of ImageEngine, imgix, and other similar platforms here.
So, what are the performance results?
In Part II of this comparison, we run audits against separate image-heavy pages optimized by ImageEngine and imgix, respectively. Both platforms addressed the image-related issues highlighted in the CDN-less page by using next-gen formats and appropriately resizing images. Both also improved the overall loading speeds.
However, while ImageEngine only had a slight edge when it came to image optimization for desktop, it displayed significant improvements on mobile over both CDN-less and imgix-optimized pages.
Conclusion
In many ways, these two Image CDNs are very similar. Both allow you to, for the most part, sign up and start serving optimized images via their CDNs in no time. With simple and user-friendly dashboards, there also isn’t much of a learning curve.
Both are essentially headless DAMs without an interface or library to manage and edit images but with parameters and directives to take some control of how images are served.
That leads to one important point of departure between these two otherwise similar CDNs. ImageEngine focuses more on optimizing images and making them responsive. imgix provides slightly more end-to-end image optimization capabilities via their API, relying more on user input.
To that effect, imgix provides a more extensive API for you to manipulate and transform images. While ImageEngine’s controls are less extensive, the automatically applied optimization is very convenient and makes it easier to implement ImageEngine. You can also change settings from the dashboard without digging around for URLs in your source code.
If you like a higher degree of image optimization and less clutter with URL parameters, go with ImageEngine. If you like Fastly and require more advanced image manipulation through URL parameters, go with imgix.
However, as we’ll prove in Part II, ImageEngine’s infrastructure and advanced device-detection do result in superior image optimization — a priority when considering an image CDN.