Какова оптимальная практика оптимизации гибкой мобильной версии веб-сайта?

Question

Я хочу исключить некоторые элементы на моем веб-сайте при просмотре его на экране с небольшим разрешением экрана, поэтому я использую CSS-запросы для скрытия элементов. Но, например, ящик Facebook Like по-прежнему загружается в фоновом режиме - несколько javascripts и css-файлов - как я могу предотвратить их загрузку, чтобы уменьшить время загрузки страницы?

Сейчас я использую PHP для проверки агента пользователя, а затем просто исключаю код, но мне интересно, действительно ли это лучший способ. Со временем мне придется изменить PHP, когда появятся новые устройства. Есть ли сценарий, например Modernizr, здесь?

Answer 1

Использование внешнего и внешнего миксов было бы лучше всего. Вы можете использовать что-то вроде WURFL или даже Apache Mobile Filter, чтобы упростить работу с внутренним контентом и загрузить определенный контент только тогда, когда is_tablet() или is_mobile() являются истинными.

С другой стороны, я бы рекомендовал проверить изображение jQuery lazy-load и share-button при загрузке по запросу (например, techcrunch.com). Эти две технологии fron-end могут действительно улучшить время загрузки страницы (они сокращают почти половину начального времени pageload на моем сайте).

Answer 2

В зависимости от ситуации вы также можете использовать Modernizr (переднее решение для javascript), чтобы обнаружить что-то правдоподобное (например, [ширина> 320]), а затем условно загрузить некоторые скрипты и т. Д. На основе этого.