система онлайн-бронирования
г. Донецк, Украина, ул. Артёма, 87
+38 (062) 332 33 32, 332-27-71
ЗАБРОНИРОВАТЬ
НОМЕР

Статьи

Prerender.io - Архитектура Prerender и улучшение AngularJS SEO - Блог Юлианга

  1. Что такое Prerender
  2. Что такое решения Prerender
  3. Вариант 1: уровень применения
  4. Вариант 2: Уровень контейнера сервера
  5. Сравнение решений
  6. Проблемы производительности

Просмотры: 21 010

Есть много хороших JavaScript-фреймворков (например, AngularJS, BackboneJS, ReactJS), которые были выпущены в последние годы, и они становятся все более и более популярными. Многие компании и разработчики используют их для разработки приложений. Есть много преимуществ, которые мы используем эти платформы:

  • Раздельная разработка внешнего интерфейса и разработка внутреннего интерфейса.
  • JavaScript Framework + Restful API (или архитектура Microservice) очень гибок и прост в обслуживании, мы можем использовать один и тот же набор API для себя и наших клиентов.
  • Очень легковесный бэкэнд по сравнению с традиционными средами MVC, т.е. ASP.NET MVC, Spring MVC,…
  • Помогите улучшить производительность разработки.

Проблема интенсивного использования инфраструктуры JavaScript, особенно на страницах, обращенных к пользователю (не на страницах администрирования), заключается в том, что мы используем виртуальные элементы или атрибуты и объект JSON, связывающий JavaScript, не дружественный для SEO. Многие поисковые системы, сканеры социальных сетей даже не поддержка сканирования / индексации страниц JavaScript.

Хорошо, что мы можем использовать PreRender.io для предварительного отображения страницы (которая будет выполнять JavaScript на странице), прежде чем она будет отображаться поисковым роботам.

Что такое Prerender

Prerender.io разработан с помощью Node.js, он позволяет идеально сканировать ваши приложения javascript поисковыми системами, социальными сетями и совместим со всеми фреймворками и библиотеками JavaScript. Оно использует PhantomJS визуализировать страницу, представленную на JavaScript, как HTML. Кроме того, мы можем реализовать кэш на уровне сервисов prerender, что значительно улучшит производительность.

PhantomJS - это автономный сценарий WebKit с JavaScript API. Он имеет быструю и встроенную поддержку различных веб-стандартов: обработка DOM, селектор CSS, JSON, Canvas и SVG.

Существует много промежуточного программного обеспечения для prerender на разных языках (middleware - это библиотека, которую мы можем использовать для реализации логики prerender внутри приложения):

Полный список промежуточного программного обеспечения prerender: https://prerender.io/documentation/install-middleware , Apache и Nginx - промежуточное ПО уровня контейнера сервера, другие - промежуточное ПО уровня приложения.

Официальный сайт: https://prerender.io/ , URL-адрес github: https://github.com/prerender

Что такое решения Prerender

Как правило, у нас есть 3 различных решения для реализации с prerender.io

  • Вариант 1: уровень применения

Реализуйте логику prerender.io на уровне приложений с помощью промежуточного программного обеспечения (т.е. промежуточного программного обеспечения NodeJS Express, промежуточного программного обеспечения Ruby on Rails, промежуточного программного обеспечения ASP.NET MVC и т. Д.)

  • Запрос приходит
  • Приложение проверит, поступил ли запрос от сканеров (на основе информации агента пользователя) или нет.
  • Если запрос исходит от сканеров, appliaction будет вызывать сервис prerender с исходным URL-адресом в качестве строки запроса.
    • Сервис Prerender вызовет приложение
    • Приложение возвращает исходный HTML-код с логикой JavaScript в службу prerender
    • Сервис Prerender будет выполнять JavaScript внутри HTML, аналогично браузеру
    • Сервис Prerender вернет окончательный HTML-код в приложение.
    • Appliaction вернет окончательный HTML-код в браузер.
  • Если запрос поступает от обычных пользователей, приложение выполнит вывод и отправит обратно в браузеры.

Если запрос поступает от обычных пользователей, приложение выполнит вывод и отправит обратно в браузеры

  • Вариант 2: Уровень контейнера сервера

Реализуйте логику prerender.io на уровне контейнера сервера. (т. е. Apache, Nginx, IIS) с помощью промежуточного программного обеспечения для перезаписи URL.

  • Запрос приходит
  • Контейнер сервера (т. Е. Apache, Nginx, IIS) проверит, поступил ли запрос от сканеров (на основе информации агента пользователя) или нет.
  • Если запрос исходит от сканеров, то переписать URL-адрес (с исходным URL-адресом в качестве строки запроса), чтобы предварительно обработать службу.
    • Сервис Prerender вызовет приложение
    • Приложение возвращает оригинальный HTML с логикой JavaScript
    • Сервис Prerender будет выполнять JavaScript внутри HTML, аналогично браузеру
    • Сервис Prerender вернет окончательный HTML в контейнер сервера (то есть Apache, Nginx, IIS).
  • Если запрос поступает от обычных пользователей, то перенаправляет трафик в приложение в обычном режиме. Приложение выполнит и вернет вывод в контейнер сервера.

Приложение выполнит и вернет вывод в контейнер сервера

Реализуйте логику prerender.io на сетевом уровне с помощью прокси-сервера балансировки нагрузки, то есть HA Proxy:

  • Запрос приходит
  • Балансировка нагрузки Прокси проверит, поступил ли запрос от сканеров (на основе информации о пользовательском агенте) или нет.
  • Если запрос поступает от сканеров, то перенаправляет трафик (с исходным URL-адресом в качестве строки запроса) на сервис предварительной обработки.
    • Сервис Prerender вызовет приложение
    • Приложение возвращает оригинальный HTML с логикой JavaScript
    • Сервис Prerender будет выполнять JavaScript внутри HTML, аналогично браузеру
    • Сервис Prerender вернет окончательный HTML-код для балансировки нагрузки прокси.
  • Если запрос приходит от обычных пользователей, то перенаправляет трафик в приложение. Приложение выполнит и вернет вывод в прокси баланса нагрузки.

Приложение выполнит и вернет вывод в прокси баланса нагрузки

Сравнение решений

Выше 3 разных решений решают одни и те же проблемы на разных уровнях, но у них разные результаты производительности.

  • Вариант 1: уровень применения

Это решение легко реализовать и легко отладить, но оно также делает приложение тяжелым, так как приложению необходимо дождаться вызова приложения службы prerender и выполнить JavaScript, это займет много времени, в зависимости от сложности логики JavaScript. , Таким образом, узким местом этого решения будет приложение. Запросы будут зависать на уровне приложения, на уровне контейнера сервера и на уровне сети.

Если служба prerender не работает, это повлияет на работу обычного пользователя (длительный запрос на услугу prerender, использование ресурсов как в приложении, так и в контейнере сервера).

  • Вариант 2: Уровень контейнера сервера

Это решение использует логику перезаписи URL для перемещения узкого места с уровня приложения на уровень IIS, по крайней мере, для самого приложения, его будет легче расширять, и оно гибко на уровне приложения. Запросы будут зависать на уровне контейнера сервера, на уровне сети.

Если служба prerender не работает, это также повлияет на работу обычного пользователя (длительный запрос службы prerender, использование ресурса в контейнере сервера).

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

Благодаря этому решению даже служба предварительного просмотра не работает, это не повлияет на работу обычного пользователя.

Основываясь на вышеупомянутом базовом анализе, вообще говоря, вариант 3 лучше, чем вариант 2, вариант 2 лучше, чем вариант 1.

Проблемы производительности

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

В следующем посте я объясню, как реализовать сервис prerender с помощью проекта opensource: https://github.com/prerender


Prerender.io связанный

  1. Prerender.io - Архитектура Prerender и улучшение AngularJS SEO
  2. Prerender.io - Настройка службы Prerender для JavaScript SEO
  3. Prerender.io - лучшие практики внедрения
  4. Prerender.io - промежуточное программное обеспечение уровня приложения - ASP.NET HttpModule
  5. Prerender.io - Промежуточное программное обеспечение уровня приложения - ASP.NET Core Middleware
  6. Prerender.io - jQuery и angularJS Плагин для prerenderReady

-------------------------------------------------- -----------

Похожие

Что такое поисковая оптимизация (SEO)?
SEO - это метод улучшения и продвижения сайтов. SEO также может увеличить количество посетителей, полученных из поисковых систем (Google, Yahoo, Bing и т. Д.). Есть много аспектов, которые влияют на SEO, начиная со слов на вашем сайте и заканчивая ссылками на сайт.
Что такое SEO? - Марвик Поисковое Маркетинговое Агентство
... такое SEO и SERP? SEO означает Поисковая оптимизация и это просто способ сказать, что таким поисковым системам, как Google и Bing, легче находить ваш контент. Поисковые системы ставят своей целью подбор релевантного, качественного контента для вашего поиска. Если, например, вы заходите в Google и вводите «лучший триммер для собак»
Написание в перспективе SEO
... чтобы лучше понять оптимизацию для поисковых систем . Что значит писать в SEO? Все просто: если вы хотите, чтобы ваш текст находился в самых важных поисковых системах - например, Mr. Google - вы должны сделать его доступным для поиска.
Что такое SEO?
И вот еще три загадочные буквы: SEO. Эта аббревиатура расшифровывается как поисковая оптимизация , что на практике означает, что роботы посещают ваш сайт случайным образом и оценивают, работает ли он в поисковых системах (особенно List и Google), или выбрасывают его в историю. Что такое "SEO оптимизация"? Как говорится, не смешивайте яблоки и груши вместе. Термин «SEO оптимизация» является неточным переводом английского термина. SEO
SEO агентство
Мы живем во времена, когда доступ в Интернет стал более демократичным и расширился таким образом, что он стал повсеместным в нашей жизни. Благодаря мобильным устройствам и Wi-Fi мы ежедневно проводим время в сети и больше не знаем, как жить без всемирной паутины. В настоящее время, согласно текущим данным, во всем мире насчитывается более 4 миллиардов пользователей Интернета.
Что такое операционная система индикаторов SEO?
Название «Операционная система индикаторов SEO» может ввести в заблуждение, поскольку она не имеет много общего с традиционной системой индикаторов (см. « Что такое система показателей? «). Для этого поговорим подробнее об операционных показателях SEO. Операционные показатели SEO обычно могут быть логически связаны (причина - следствие), но редко математически. Использование компьютеров,
Понимание SEO
Поисковая оптимизация (SEO) - это искусство создания веб-сайта, чтобы получить хороший рейтинг в поисковых системах онлайн. Цель состоит в том, чтобы дать возможность тем, кто заинтересован в содержании сайта, легко его найти. Независимо от того, продаете ли вы продукт, рекламируете сообщение или просто делитесь информацией, эффективно оптимизированный веб-сайт может привлечь больше посетителей, что сделает сайт более успешным. SEO значительно изменилась с момента его появления. Изначально
Джексонвилл SEO
... что вы делаете, увеличьте свою экспозицию Развивайте свой бренд и улучшайте свою прибыль Получите консультационные услуги на сайте с SEO специалистами Получить больше клиентов, больше клиентов и больше доходов Превзойти конкурентов онлайн SEO & SEM для бизнеса в Джексонвилле Чикагская компания веб-дизайна и SEO - это экспертная SEO-компания, предоставляющая бизнесам первоклассное SEO в Джексонвилле,
SEO Cairns
Благодаря быстрому расширению продвижения веб-сайтов, они также обслуживают компании в Кернсе, помогая им добиться лучшей видимости в Интернете. SEO Cairns by Website Promotions даст вашему бизнесу значительный рост поисковой выдачи за счет «белой шляпы» SEO, что означает отсутствие манипулятивного построения ссылок. Поощрения веб-сайтов соответствуют рекомендациям Google для повышения рейтинга вместе с их SEO-ориентированными веб-дизайнерами и разработчиками. Они обеспечивают экономически
SEO Петри
Да, мы живая лаборатория, практикуем то, что проповедуем, и рассказываем вам все об этом. 12 дней назад я писал о нашем (пере) рождении как о присутствии в Google , Сегодня мы находимся на втором месте в нашем ключевом термине «Агентство по маркетингу технологий B2B» на Google.com (это верно .com!). Вот что произошло между тем ...
SEO консультант
SEO-консультанты стоят денег? Не очень хорошо в основных поисковых системах? Вам не хватает возможности быть в авангарде, когда пользователи ищут ключевые слова, относящиеся к вашим продуктам или

Комментарии

Что такое SEO и какова цель SEO?
Что такое SEO и какова цель SEO? Если вы выполнили процесс оптимизации поисковой системы на странице сайта и заняли 1-ю страницу Google, то, конечно, ваш сайт будет получать много кликов или посещений вашего сайта пользователями интернета, но если вашего сайта нет на странице 1 Google, тогда, конечно, пользователи будут заходить на ваш сайт намного меньше или получат небольшой клик. При проведении поисковой оптимизации, это процесс, который должен осуществляться систематически
Что такое категории и что такое теги?
Что такое категории и что такое теги? В чем разница между категориями и тегами? Сколько категорий и сколько тегов можно использовать для публикации? Работает ли теги как мета ключевые слова? Как категории и теги играют роль в SEO? Если вы ищете ответы на любой из вопросов, то вы находитесь в правильном месте. Какие категории и теги в WordPress? Категории и теги в WordPress известны как таксономии, и основная цель категорий и тегов состоит в сортировке
SEO SEM: что такое SEO?
SEO SEM: что такое SEO? Что такое SEM? В чем смысл поисковой оптимизации и поискового маркетинга? Почему Google и поисковые системы могут развивать мой бизнес или мою карьеру? Что значит иметь сайт, оптимизированный для SEO? Что такое поисковая выдача и ключевые слова? Каковы преимущества одного хорошее позиционирование ? Каковы лучшие инструменты SEO? Какая деятельность имеет смысл инвестировать?
Что такое многоязычное SEO и многорегиональное SEO?
Что такое многоязычное SEO и многорегиональное SEO? Многоязычное SEO - это практика предоставления оптимизированного контента на разных языках. Многорегиональный SEO - это практика создания оптимизированного контента для веб-сайтов, специально предназначенного для нескольких географических регионов. Эти две стратегии часто пересекаются, поэтому мы рассмотрим их обе в этом посте. Они также связаны с другими аспектами онлайн-маркетинга, такими как оптимизация
Но что такое SEO копирайтинг или SEO копирайтинг?
Но что такое SEO копирайтинг или SEO копирайтинг? В этой статье для начинающих SEO я даю четкий ответ на этот вопрос. Начинается с SEO SEO расшифровывается как поисковая оптимизация . На голландском языке: поисковая оптимизация (вы записываете слово для Scrabble?). Из этого можно сделать вывод, что SEO копирайтинг заключается в следующем: SEO копирайтинг: написание веб-текстов, оптимизированных для
Что такое SEO SEO?
Что такое SEO SEO? Yoast SEO это плагин, с помощью которого вы можете установить все необходимые настройки щелчком мыши. У меня уже есть в моем списке раз лучшие плагины для WordPress представлены более подробно. Кроме того, я могу дать вам плагин Все в одном пакете
Итак, вы только что закончили читать эту тему «Что такое SEO?
Итак, вы только что закончили читать эту тему «Что такое SEO?». Вы заслуживаете почетное звание младшего специалиста по SEO! , Мои поздравления! Я надеюсь, что эта статья была очень полезной и всеобъемлющей для вас. И мы будем рады, если вы не забудете поделиться этим постом с друзьями или коллегами. Хочу отметить, что услуги SEO также включены в наши Пакеты поддержки WordPress если вы не хотите тратить
Что такое локальный SEO и чем он отличается от обычного SEO?
Что такое локальный SEO и чем он отличается от обычного SEO? Может ли местное SEO принести пользу бизнесу? Читайте ниже, чтобы узнать, что такое локальный SEO и почему он на самом деле очень важен для вашего малого бизнеса или стартапа. Местные SEO ориентированы на локальную аудиторию Цель SEO - получить высокий рейтинг в поисковых системах, чтобы стать более заметным для конкретной целевой аудитории. Обычный SEO не ориентирован на то, что это за аудитория. Если
Но что еще более важно: вы знаете, что такое SEO?
Но что еще более важно: вы знаете, что такое SEO? SEO: поисковая оптимизация Википедия описывает SEO как: « ... все действия, направленные на то, чтобы веб-страница получила высокий балл в обычных результатах поиска поисковой системы ». Обратите внимание, здесь написано: поисковая система. И не только Google. Несмотря на то, что повышение в Google с вашим интернет-магазином - самая важная
Вы понимаете, что вы, вероятно, должны знать, что такое «SEO» и что-то делать с этим, но у кого есть время?
Вы понимаете, что вы, вероятно, должны знать, что такое «SEO» и что-то делать с этим, но у кого есть время? Вот наша попытка разбить все, что вам нужно знать о значении SEO: Что такое определение SEO? SEO означает «поисковая оптимизация». Чтобы разобраться в этом, поисковая система - это просто такой сайт, как Google, Yahoo или Bing, куда люди ходят и ищут такие вещи, как «рецепты куриной запеканки» или «как починить спущенное колесо».
Дополнительную информацию о том, почему ключевые слова так важны для вашего SEO рейтинга, смотрите в нашем Что такое поисковая оптимизация (SEO)?
Вы понимаете, что вы, вероятно, должны знать, что такое «SEO» и что-то делать с этим, но у кого есть время? Вот наша попытка разбить все, что вам нужно знать о значении SEO: Что такое определение SEO? SEO означает «поисковая оптимизация». Чтобы разобраться в этом, поисковая система - это просто такой сайт, как Google, Yahoo или Bing, куда люди ходят и ищут такие вещи, как «рецепты куриной запеканки» или «как починить спущенное колесо».

Что такое SEO?
Акое SEO и SERP?
Что значит писать в SEO?
Что такое SEO?
Что такое "SEO оптимизация"?
Что такое операционная система индикаторов SEO?
« Что такое система показателей?
Не очень хорошо в основных поисковых системах?
Что такое SEO и какова цель SEO?
Что такое категории и что такое теги?

Новости

Отель «Централь» Официальный сайт 83001, Украина, г. Донецк, ул. Артема, 87
Тел.: +38 062 332-33-32, 332-27-71
[email protected]
TravelLine: Аналитика


Студия web-дизайна Stoff.in © 2008