1. Нет ли ошибки?)
Ошибки в чем?
2. Браузер не сможет кэшировать такие картинки?
Дело не в том что не сможет - не будет, поскольку это бессмысленно.
Представим что все эти картинки в dataurl браузер закэшировал... и что? Теперь они магическим образом исчезнут из страницы которую вы передаете браузеру? Нет. Сервер все так же встраивает их в страницу и браузер ее все так же скачивает целиком. А зачем он их тогда кэшировал?
Кэш это всегда какие-то тяжелые данные ассоциированные с некоторым коротким ключом. Например файл изображения с его URL. Увидев URL в странице браузер не станет скачивать файл, а возьмет его из кэша.
В вашем случае URL это и есть сам файл - тут невозможно никакая экономия.
Преимущество dataurl - картинки отображаются гораздо раньше так как загружены вместе со страницей или стилями.
Недостаток - они скачиваются всякий раз когда нужно загрузить страницу.
Таким образом хорошо это или плохо зависит от сценария использования вашего сайта.
Если клиент только один раз загрузит страницу с товарами, посмотрит на цены и в ужасе закроет вкладку, то потери и правда будут в районе нескольких процентов. Если несколько раз... ну давайте посчитаем.
Пусть размер страницы 200Кб и на ней еще 2Мб изображений. Тогда в классической ситуации первая загрузка страницы будет ~2200Кб, а все последующие 200Кб. В вашем случае все загрузки будут по 2200Кб.
Таким образом если клиент посещает страницу один раз - разницы нет. Если два - то доп расходы составят 83%, если 4 раза - 215% лишнего трафика сверху.
Но все зависит от повторных просмотров и размеров ваших картинок и отношению этого размера к размеру страницы.
Средний