Лучшая практика для обработки конфликтующих условно визуализированных элементов при рендеринге на стороне сервера?
Моя ситуация очень похожа на ситуацию этого парня: условный рендеринг на стороне сервера.
Однако я не нашел там слишком полезных ответов, первый не рекомендовали, когда я посещал библиотеку, на которую он ссылался. Поэтому я публикую этот вопрос, чтобы получить более целенаправленные ответы на тему различных способов удаления компонента со стороны сервера.
Чтобы прояснить, моя текущая ситуация заключается в том, что я условно визуализирую немного другой макет на мобильных экранах через определенные точки останова. Это дублирует изображение на стороне сервера, поскольку окно недоступно, пока клиент не загрузит сайт в браузер пользователя.
У меня есть пара идей относительно этого подхода, и любые отзывы или советы по этой теме были бы полезны.
Вариант 1. Удалите конфликтующие элементы только с сервера и позвольте им повторно ввести их при загрузке клиента.
(Я не думаю, что это правильный подход, поскольку вы обычно хотите, чтобы сервер и клиент соответствовали друг другу)
Вариант 2. Удалите все элементы условного рендеринга со стороны сервера и клиента, затем, когда клиент загрузится, запустите условную логику и отрендерите указанные компоненты.
(Это имеет смысл, но я также слышал, что идея пропуска контента может повредить вашему рейтингу в индексировании Google. Я также не уверен, как лучше всего реализовать эту опцию.)
Вариант 3: полностью очистить серверный рендеринг и отобразить пустую страницу.
(Это звучит как самый простой вариант, если вы согласны с устранением побочных преимуществ лучшего времени загрузки с помощью рендеринга на стороне сервера. Однако по этой причине я хотел бы реализовать вариант 2, если я смогу найти качество (пока простое) решение)