Since I'm currently developing a 2D game for mobiles, overdraw and drawcall count is my first priority in the design of the application I've thought initially to split each sprite in two parts: one where each pixel is fully opaque (to render with cutout shaders in front-to-back order) and the other part with semi transparent edges (which will be ordered back to front)
Since I need to support ES2.0 devices, I can't use texture-arrays and I need to fit as many sprites as possible in a single 2048x2048 texture atlas to reduce drawcalls and ensure mobile compatibility, but as you can see from this picture:
Splitting sprites in opaque and non-opaque parts will certainly double the space occupied in the atlas, thus decreasing by half the potential amount of consecutive sprites I can draw in a single drawcall
This way, I'm paying drawcalls to reduce overdraw. By rendering the entire sprite with transparent shaders I'd pay overdraw to reduce drawcalls.
Am I missing something? Is there a better approach?