Для добавления изображений на сайт с двумя разными темами оформления можно использовать тег <picture> соответствующий srcset для каждой темы. Например:
```html
<picture>
<source srcset="image-light.jpg" media="(prefers-color-scheme: light)">
<source srcset="image-dark.jpg" media="(prefers-color-scheme: dark)">
<img src="fallback.jpg" alt="Fallback Image">
</picture>
```
Для реализации функционала динамической замены изображений в зависимости от выбранной темы без использования JavaScript, можно использовать атрибут media в теге <source> для определения темы оформления. При этом использование lazyloading также не будет зависеть от JavaScript.
Чтобы скрипт проверял текущую тему и менял исходные пути к изображениям в элементе <picture>, это может быть эффективным решением, если такой функционал будет критичен для пользователей. Однако, это может повлиять на скорость загрузки страницы, так как скрипт будет добавлять дополнительную нагрузку на рендеринг страницы. Важно учитывать, что скрипт должен быть оптимизирован для повышения производительности и минимизации негативного влияния на загрузку страницы.