Какие размеры картинок выбрать для responsive?
В современной верстке должен по максимуму использоваться вектор. Это снимает кучу проблем.
Разумеется, не все картинки можно/нужно перегонять в вектор. При использовании растра, в общем случае, достаточно две картинки — x1 и x2. X1 — это тот размер, в каком картинка отображается на сайте, x2, соответственно, удвоенный. Например картинка 100х100, к ней делаем ретина-вариант 200х200.
Всё остальное зависит от бюджета проекта.
Есть время/деньги — заморачиваемся. Пилим третий вариант x3, подключаем полифилы для srcset, делаем дополнительные наборы для брикпойнтов в медиазапросах.
Нет времени/денег — тупо грузим везде удвоенные размеры, и указываем реальные в css.
По большому счёту особого смысла сильно оптимизировать картинку нет. Они просто должны быть разумного разрешения и размера.
Но если очень хочется, то посмотрите какие разрешения выбирают различные библиотеки вроде бутстрапа и других.
По моему опыту, могу сказать что оптимальнее всего для критичных (крупных, наполненных деталями итд) картинок лучше всего делать три размера - для самых маленьких экранов (для мобильных, с размером viewport до 600 включительно), для средних экранов (с размерами до 1920 включительно) и для крупных. И, соответственно делаете картинки нужного размера, ориентируясь на каждый из размеров экрана.
Для некритичных - заниматься смысла нет, много не выйграете. Но если у вас само пережимается под нужные размеры, можете и их пережимать по тем же правилась.
Да, еще для оптимизации - используйте ленивую загрузку картинок (загрузка при прокрутке). Заглушки для картинок (чтобы контент не прыгал пока картинки нет) можно делать с помощью генерируемого svg нужного размера, такая картинка будет весить около 500 байт. Например, по адресу site.ru/svg?x=826&y=800 возвращать svg указанного размера.
Далее, чтобы загружать картинки не по мере прокручивания, а сразу после того как загрузилась вся страница, можно использовать link rel="prefetch". Тогда вся страница загрузится разу, а "ленивые" картинки загрузятся после и положатся в кеш. И пока человек будет крутить, загружаться они будут уже из кеша а не по сети.