search

actum / gulp-dev-stack

Actum dev stack based on gulp
MIT License
11 stars 7 forks source link

Gulp task: Images #65

Closed kettanaito closed 8 years ago

kettanaito commented 8 years ago

Minimize raster graphic

I like what we do with SVG, but we still use raster graphics sometimes. Maybe we should add a general minify task for those files?

Gulp ImageMin looks good, and can optimize SVG images as well. I have tried it on one project and it seems to be working just fine. It gives 20-25% of size decrease in average.

Naming

It has been confusing for me that files under src/gfx/svg/*.svg are compiled to dist/gfx/icon/svg.svg. I would suggest to simplify the logic of how SVG storing works.

We use both compiled SVGs and single svgs. I suggest the following structure:

Development

Folder gfx/svg/icons/ compiles into a single icons.svg store. Ideally, it would be good to make any folder inside gfx/svg/ behave this way. It will let you create different bundles of SVG for different purposes (imagine some Search page uses about 50 svg icons, specific only for Search page; no need to load those 50 icons everywhere else).

Single SVG images are being optimized and put the same way they are.

Tell me what do you think about this. Thank you.

janpanschab commented 8 years ago

Raster images

I know we are using them sometimes and it is bad. But, OK. Why not. I hope it will be faster than it was. We were using it in grunt projects years ago :-) It was also creating some problems on Windows. Let’s test it.

Naming

IMHO we don’t want to have different structure in DEVELOPMENT and PRODUCTION mode. Unlike with js and css we want to have minified version in dev mode, because there is a chance it will be broken after minification. But we could do the same with gfx folder what we are doing with nunj > html files. I would suggest structure (only small changes from yours):

kettanaito commented 8 years ago

@janpanschab Thank you for your suggestion. I have implemented single/sprite optimization right now, and will change the naming when moving the branch to master.