Гибридное веб-приложение на основе страницы / одной страницы (Angularjs, Ember.js) с прогрессивным улучшением?

Мне интересно, нашел ли кто-нибудь решение этой проблемы. Есть ли способ получить лучшее из обоих миров:

  • создать сайт на основе страниц с постоянными ссылками, доступностью, SEO и постепенным улучшением (в основном все лучшие практики веб-разработки)
  • а для тех, у кого есть javascript, отзывчивый интерфейс с ajax-загрузкой контента, никакие обновления страниц при навигации по страницам базового сайта, минимальная избыточная загрузка скриптов /content/css/ и т. д. (все преимущества клиентской среды, такой как AngularJs или Ember.js)

Я вижу, что некоторые крупные сайты могут управлять этим (gmail, stackru), и я вижу, что новый сайт Джеффа строит голую версию сайта в теге noscript.

  1. Является ли решением для гибридного приложения на основе страниц / одностраничной программы создание двух версий сайта, отправка обеих версий и предоставление клиенту возможности решить, что именно он может показать? (это то, что делает Gmail?)
  2. Или проблема в том, что AngularJS et al. просто не предназначены для постепенной деградации?

Мой СУХОЙ мозг мешает думать, что #1 - это ответ.

(Причина, по которой я сосредотачиваюсь на AngularJ, заключается в том, что мне нравится его поддержка шаблонов HTML, декларативный стиль и его попытки исправить js scoping. Ember и другие фреймворки также превосходны; возможно, одна из них лучше подойдет для гибридного сайта?)

2 ответа

Решение

Этот вопрос немного нюансов, потому что ответ "это зависит". Например, вы упомянули Gmail, нет никаких причин, по которым приложение, такое как Gmail, должно быть проиндексировано для SEO, хотя в зависимости от того, что вы хотите или нуждаетесь в поддержке, вы можете убедиться, что можете поддерживать отсутствие Javascript.

Однако даже аргумент "без javascript" в наши дни становится утомленным и слабым, по крайней мере, для класса "веб-приложений". Если я хочу использовать приложение Windows, мне нужна Windows, если я хочу использовать веб-приложение с поддержкой javascript, вполне логично предположить, что мне понадобится браузер, который не поврежден для его использования.

Однако, возвращаясь к вашему вопросу, я могу говорить только с AngularJS, потому что я наиболее знаком с ним. По большей части это позволяет вам поддерживать подход прогрессивного улучшения, хотя не ожидайте использовать такие вещи, как маршрутизация URL, если это то, что вы хотите поддерживать. Что вы можете сделать, это использовать AngularJS контроллеры, привязки и директивы, аналогичные тому, как вы можете использовать jQuery как способ улучшения взаимодействия и поведения страницы.

Просто имейте в виду, что этот подход серьезно ограничит то, что вы можете делать с Angular (или Ember в этом отношении), и он может начать спорить с тем, что вы получаете от этого подхода, который вы не могли бы легко сделать с помощью только jQuery.

Альтернатива в наши дни - делать то, что делают такие сайты, как Twitter. Это в основном служит для полностью визуализированного HTML с сервера для любого представления начальной загрузки, а затем использует Javascript для последующей загрузки и улучшенного поведения пользовательского интерфейса. Это очень эффективно (хотя, возможно, довольно сложно реализовать), если вам действительно нужно поддерживать просмотр с Javascript и без него, и имеет дополнительное преимущество, заключающееся в улучшении времени рендеринга / загрузки для первого запроса. Опять "это зависит", потому что это во многом зависит от того, как на самом деле работает ваш сайт, если это возможно. Вы должны разработать для него, и это не будет тривиальным или легким.

Обновить:

Что бы это ни стоило, мы берем подход Year of Moo и отрисовываем страницы, которые нуждаются в SEO, используя PhantomJS, и помещаем их в кешированное начальное состояние где-то, чтобы их обслуживать. У нас есть грабли, которые мы запускаем при развертывании, чтобы обновить это. Опять же, это только начальное состояние, но оно помогает обойти проблему на данный момент.

Вещи всегда меняются, хотя, и я уверен, что через год или около того передумаю над этим подходом.

Читали ли вы Google Создание приложений AJAX для сканирования. Вы можете иметь JavaScript-приложение на одну страницу и контент для сканирования.

Если вы придерживаетесь angular, то есть интересная статья: оказывается, можно проиндексировать ваше приложение AngularJS

Другие вопросы по тегам