I would also recommend ImageOptim and/or Squash. Both really useful tools.
A further approach that you could take to ensure that your image looks great on every screen size, is to supply a bank of different width images and have the browser select the most appropriate for whatever device/screen the image is being viewed on. That’s what my latest stack, Srcerer, allows you to do. With Srcerer you are able to supply up to 8 image widths ranging from, for example, 320px (a 1x phone) through to say 2732px (the latest 2x 12.9" iPad Pro). When the page is loaded the browser simply selects the most appropriate image from the bank to load and display.
And @teefers is right about considering the widest that an image will display on screen, however a 540px space on the webpage would need a 1080px image to display perfectly on a 2x screen. Srcerer has you covered for this type of scenario too, as you can also specify how much of the screen an image uses at various breakpoints and the browser can use this information (along with the supplied image bank widths and the device resolution) to serve the right image for the space.
You can read the recent forum post about Srcerer here
(p.s. the launch discount is still good until Friday 
)