Building resized images/thumbnails with Broccoli.js


A grid of high-res images puts a high toll on load times and bandwidth. I’m trying to figure out if it’s possible to set up Broccoli.js to generate thumbnails, but I’m having a hard time finding out how one implements this. Are there any recommended guides or examples of similar Broccoli.js jobs?

In my case I have several directories with high-res source images, from which downsized and cropped thumbnails must be generated, preferably in separate directories.


I think the best way is to create an addon and use the postBuild hook to generate thumbnails. I use it here:


I guess this could deserve it’s own ember-cli-deploy plugin. But wouldn’t it be more semantically correct to include this task in the Broccoli.js build pipeline instead of the deployment pipeline?


It also works if you just run ember build so it does not have to be ember-cli-deploy plugin. This was just meant as a pointer. But it deserves it’s own ember-cli-deploy plugin :wink:


I found ember-cli-imagemin which is related, and is at least very handy in (re)compressing source images. Think it would be nice to make a similar Brocolli plugin for resizing.