Современный сайт на javascript.

Всем привет!

Сегодня хотел бы показать нашу новую работу: http://troika-gorod.ru/ (запустили несколько дней назад).

Задача стояла следующая: есть сторонняя работающая система, мобильное приложение, API, и надо было под это все сделать самостоятельный веб-сайт, работающий по API. В итоге получился такой даже не сайт, а веб-приложение. То есть он полностью на javascript/react работает (даже обработка УРЛ страниц), а MODX используется только для обработки API-запросов.

По большей степени здесь веб-сервер вообще не используется. То есть в браузер всегда приходит минимальный HTML-код (ссылки на JS/CSS файлы и один основной div). У данной реализации конечно есть свои минусы (которые позже будут нивелированы за счет ввода node.js-сервера между пользовательским запросом и конечным сайтом (как это работает на сайте MODX-Клуба)), но зато есть весьма весомые плюсы. Один из них - это высокая скорость загрузки и рендеринга страниц. Даже при первом заходе на сайт (без кеша в браузере) полный onLoad страницы - 1-2 сек. Код страницы веб-сервер отдает за 10 мсек (что не удивительно, его node.js отдает как есть из памяти). Многие переходы внутри сайта происходят без перезагрузки страницы, что дает еще один значительный плюс в визуальной скорости сайта. И даже без какой-либо оптимизации PageSpeed Tools дает 85+ баллов из 100.

В общем, теперь мы переходим на такие front-end технологии и скорее всего в ближайшем будущем таки запустим разработку серии компонентов для сайтов, в которых эти технологии бы очень пригодились.

Comments

Николай, это круто! Что почитать, чтобы делать такие сайты?)

Читать на самом деле много. webpack, react, material-ui, чистый javascript и т.п. Скоро начну цикл статей по этому направлению.

Здравствуйте Николай. Смотрю вы выбрали react.js, а Angular 2 не рассматривали? Я думаю за такими сайтами (веб-приложениями) будущее, поэтому тоже планирую изучить данные технологии. Я конечно еще совсем "зеленый" "программист", но учиться никогда не поздно. Жду ваших статей на эту тему, они у вас всегда понятные и полезные.

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

А вы посмотрите внимательней на сам сайт MODX-Клуба. Он и без JS рендерится, на стороне сервера. Работает node.js+react-dom. Все отлично индексируется. Тройка тоже чуть позже заработает на такой связке.

Здорово! Очень быстро работает!

.block_title .searchform input {padding:0px 20px 0px 60px}

@msk13s, привет! Спасибо)

P.S. верстка не наша, наше только программирование. Верстка предоставлялась заказчиком. Мы ее как есть переносили на JSX.

Очень и очень впечатляет! Как будто прикасаешься к будущему веб-технологий! Безусловное и нужное направление, радует что эти современные технологии внедряете и нас учите! Спасибо за информирование!