Instead of serving two images, serve one. Then use transform: scaleY(-1); to inverse it; creating an up arrow.
Support for 2d transforms is quite good:
http://caniuse.com/#feat=transforms2d
Android, iOS 3.2, Opera Mobile, Chrome, Safari, Opera (desktop); – all since the earliest version tracked or long ago.
The only known lack of support is IE <= 8 and Opera Mini.
The fallback would be that the image doesn't flip on click. Alternatively, you could use a class on the <html> element (like Modernizr) to serve the fallback image only when transforms are not supported (e.g. .up { transform; } .support-no-transform .up { background-image; no-embed url; }) but that's probably not needed. Clients not supporting this should be served the javascriptless version.
Kudos to Jake, who showcased this in offline-wikipedia.
This would remove the need for the image asset for mw-ui-icon-arrow-up