Издержки WURFL против адаптивного дизайна в PHP

Question

Я работаю над собственным веб-приложением для управления проектами, которое должно поддерживать как мобильные устройства, так и настольные компьютеры.

Он построен с использованием Symfony2, jQuery, HTML5.

Есть ли какие-либо сравнения производительности между использованием WURFL в отличие от адаптивного дизайна, как на стороне сервера, так и на стороне клиента? В частности, я думаю о времени рендеринга, HTTP-вызовах (это довольно тяжело в AJAX).

Answer 1

Адаптивный дизайн, основанный на производительности, возлагает всю нагрузку на клиента, поэтому вы должны убедиться, что это работает достаточно хорошо, тестируя на многих устройствах. Не все смартфоны созданы равными - некоторые имеют медленные процессоры, которые делают код JavaScript и медийные запросы мучительно медленными. В целом, использование кода на стороне сервера может значительно облегчить работу клиента, а также позволит вам лучше контролировать его работу.

Но прежде чем задуматься об аспектах производительности, вам следует подумать, обеспечит ли этот подход адекватную мобильность. Существуют два важных аспекта мобильной версии сайта, к которым вы должны стремиться:

• Соответствующий контексту опыт- он должен быть в состоянии предоставить соответствующий опыт для кого-то, использующего мобильное устройство. Это может сильно отличаться от соответствующего опыта того же сервиса на рабочем столе. Обратите внимание, что использование мобильного устройства не обязательно подразумевает мобильность - пользователи мобильных устройств часто физически неподвижны, но, тем не менее, пользователи могут предпочитать взаимодействовать с вашим сайтом или службой иным способом при использовании мобильного устройства. Важность контекстуально подходящего опыта резко возрастает по мере того, как увеличивается количество способов взаимодействия с Интернетом: упреждающее восприятие, которое кажется подходящим для ноутбука, может показаться совершенно неправильным в телевизионном браузере, с которым вы взаимодействуете из разных источников. номер.
• Опыт чувствительного к устройству- он должен быть в состоянии предоставить опыт, который хорошо работает на устройствах, используемых клиентами вашего сайта. Этот диапазон адресуемых устройств постоянно увеличивается и становится все более разнообразным - от обычных телефонов до телевизоров. Некоторые держатся близко к лицу, другие взаимодействуют через комнату. Практически невозможно обеспечить удовлетворительный опыт работы с таким широким спектром устройств, каждое из которых имеет свои собственные ограничения и условные обозначения ввода / вывода, не адаптируя их к устройству. Крупные интернет-бренды прекрасно знают об этом и делают гораздо больше, чем может показаться - даже простая, на первый взгляд, домашняя страница Google скрывает за кулисами совершенно другой код, предназначенный для разных устройств, используемых для достижения полезного опыта на всех устройствах.

Используемый в качестве средства для доставки как настольного, так и мобильного сайта, адаптивный дизайн не обеспечивает оба желаемых аспекта идеального мобильного сайта.

• Он не может предоставить контекстуально подходящий интерфейс, потому что он обеспечивает один и тот же интерфейс независимо от устройства, которое используют люди (это ограничение может не быть проблемой для сайтов с ограниченным числом вариантов использования)
• Он может предоставлять чувствительный к устройству опыт только ограниченному кругу устройств, так как основной метод ограничивает диапазон устройств, которые могут быть нацелены на смартфоны и другие высокопроизводительные устройства. Проблема "один опыт подходит для всех" и ограниченный диапазон адресуемых устройств могут быть проблемой не для всех веб-сайтов - некоторые сайты не подходят для мобильных устройств, и в то же время некоторые владельцы сайтов могут не иметь желания обслуживать широкий ассортимент устройств.

Стоит отметить, что адаптивный дизайн оказывает неизвестное влияние на мобильную SEO, поскольку неясно, будут ли поисковые системы идентифицировать контент как дружественный для мобильных устройств и соответствующим образом ранжировать его в мобильных поисках.

Answer 2

Любая логика, которая может быть определена и применена на стороне сервера, может уменьшить передачу данных и издержки на стороне клиента. Уменьшение размера отправляемого контента - например, релевантных CSS, JavaScript, HTML и оптимизированных изображений - несомненно, станет меньшим бременем для клиента.

Решение на основе RESS (т. Е. Responsive Design + Server Side Components - http://www.lukew.com/ff/entry.asp?1392) всегда будет иметь возможность быть быстрее, чем само адаптивное дизайнерское решение. Вам всегда нужно будет учитывать значение "быстрее", но когда я вижу (возможно, плохо спроектированные) сайты с адаптивным дизайном, которые доставляют на мобильное устройство контент объемом более 1 МБ + оптимизацию производительности, которую они могут получить от небольшого количества информации на стороне сервера. огромны. Хороший документ о том, почему производительность веб-сайта имеет значение с сайта gomez @ http://www.gomez.com/resources/whitepapers/why-web-performance-matters/ и почему важна каждая секунда.

Несколько примеров того, как может помочь обнаружение функций на стороне сервера, перечислены по адресу http://www.opendeviceknowledge.com/discovery включая то, как адаптивный дизайн и мир на стороне сервера могут играть вместе.

Answer 3

Изобретатель WURFL, здесь. Похоже, что Ронан Кремин достаточно подробно рассмотрел этот вопрос. В конце концов, это вопрос юзабилити против стоимости (как разработка, так и сопровождение).

Единственное, на что я хочу обратить внимание, это то, что WURFL и адаптивный веб-дизайн не обязательно должны быть отдельными мирами. Этот и этот посты имеют мою точку зрения на эту тему.

Что еще более интересно, мы недавно запустили сервис, который делает некоторые из WURFL также бесплатными для разработчиков Javascript. Я советую вам проверить сайт http://wurfl.io/.

Короче говоря, если вы импортируете крошечный файл JS:

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

у вас останется объект JSON, который выглядит следующим образом:

{
 "complete_device_name":"Google Nexus 7",
 "is_mobile":true,
 "form_factor":"Tablet"
}

(это предполагает, что вы используете Nexus 7, конечно), и вы сможете делать такие вещи, как:

if(WURFL.form_factor == "Tablet"){
    //dostuff();
}

Это то, что вы ищете.

Спасибо