Sprite packer for Pixi.js

[marekventur]

Hi,

 

In order to reduce loading times for sprites we used to use Spritesmith with a Pixi plugin and gulp. The downside to this was its relatively slowness and that it didn't come with certain features like compression and trimming. TexturePacker (being the commercial alternative) was also not quite the right fit for us, so I decided to write our own solution. I hope it might be useful for others as well: https://github.com/gamevy/pixi-packer

 

Main features are:

- Focus on command line usage and CI

- Configuration via JSON

- Made for checking in the source images rather than the finished spritesheets

- Support for multiple scales (think retina and normal), variations (themes or languages) and loading stages

- Minimises amount of HTTP connections and download size in the finished game

- Comes with special loader plugin for Pixi.js v3: https://github.com/gamevy/pixi-packer-parser

- Fine-grained compression settings (JPEG quality, pngquant, optipng)

- Caching support to speed up conversion 

- MIT License 

 

All configuration is done via a central config file. Have a look at https://github.com/Gamevy/pixi-packer/blob/master/example.js to get an idea of the features available.

 

Comments, bug reports and contributions are welcome. There's also a lot of room for improvement (more efficient packing algorithms, better error messages, improved documentation, ...) so please get in touch if you want to help!

 

Marek

[AndreasLoew]

I just wonder what was wrong with using TexturePacker? 

[marekventur]

You need a license for starters; While it's not terribly expensive, it makes people shy away from it. It's also not open source, so it's a black box if there's any problem and I can't debug it myself.

 

But the biggest problem we had was that it just didn't fit into our setup which involved gulp and constant rebuilds on Jenkins. It also felt unnecessary to use a GUI if want we really wanted is a config file we can check into git.

[fire7side]

The texture packer free version goes out of it's way to waste as much space as possible.  I had three small sprites and a larger.  It put two of the small sprites on one side and one on the other even though there was plenty of room to put the 3 small sprites on the same side.  It's just bait and switch.  And when you consider how little money there is to be made on online games, the pro version is expensive.

[CtlAltDel]

I use shoebox which is pretty awesome and free.

[Tom Atom]

here: http://www.html5gamedevs.com/topic/3606-what-spritesheet-toolkit-does-everyone-use/?p=93716 I wrote about my Java tool that can produce TP compatible output. It is free and it has some additional features.

[Joe Kopena]

But the biggest problem we had was that it just didn't fit into our setup which involved gulp and constant rebuilds on Jenkins. It also felt unnecessary to use a GUI if want we really wanted is a config file we can check into git.

 

I don't think this is an actual problem with TexturePacker.  It has a quite extensive command line system.  I'm not sure if there is a built-in config file format, but clearly the command line options can be captured and fed into it essentially identically.  It also has a system for not rebuilding spritesheets unnecessarily, determined via hashes.  in my experience it actually integrates pretty well into an automated build setup; I invoke it primarily through Makefiles and Ant projects.

[xerver]

I use TexturePacker in my gulp flow as well, the GUI for texture packer is technically just a wrapper around the CLI tool.