Изучение Javascript в 2018

Изучение Javascript в 2018

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

Если же вы опытный разработчик веб-приложений, я задал бы вам вопрос: «infernojs лучше react или vue лучше angular ?». Можете не отвечать, но я уверен, вы поняли, о чем я. Похоже, подул ветер перемен к лучшему. Что даст нам изучение Javascript в 2018?

Лес JS изменился, а браузер Chrome ведет нас на новый уровень, где в этом лесу уже есть четкие тропинки, более простой ландшафт и направления.

Теперь мы можем создавать одностраничные приложения или гибридные приложения без зависимости от больших и раздутых фреймворков. Совсем скоро ваши одностраничные приложения будут весить совсем ничего, так как большая часть библиотек уже встроена. Позвольте доказать вам это:

Ниже приведен пример переписанного известного урока Angular Hero Editor на ES6 модуле и ES6 String Template.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

Изучение Javascript в 2018

Мы можем создавать приложения со структурой проекта Angular, но на встроенном ES6. Мечта стала явью для разработчиков. Не нужен babel, транспайлер, вы просто передаете код ES6 сразу в браузер.

Изучение Javascript в 2018

В ES6 есть такие вещи как Module loader, Template Literal. Если вы пойдете еще дальше, то вы можете создавать свои кастомные элементы прямо в браузере без зависимостей.

Однако нам все еще необходимо кое-что.

«Нам все еще нужна библиотека движка шаблонов»

Мы можем использовать Template Literal как часть ES6, но Template Literal не движок шаблонов. Функции движка шаблонов – это преобразование Template Literal в узел DOM и вставка его в DOM контейнер.

Разберем код ниже:

render(html`<div>Hello World</div>`,document.body);

Текст между кавычек « и есть ES6 Template Literal, а render и html относятся к Templating Engine. Код выше говорит, что мы хотим добавить div с текстом «Hello World» в document body.

В проекте ES6 Hero Editor теги html и htmlCollection, а также render входят в Templating Engine.

Изучение Javascript в 2018

Opensource Google lit-html

Недавно google анонсировали проект lit-html, чтобы представить движок шаблонов на ES6 String literal.

Из readme с Github можно понять цель lithmtl: «lit-html позволяет писать HTML шаблоны с помощью JavaScript template literals и эффективно рендерить и повторно рендерить эти шаблоны в DOM.»

Библиотека все еще в разработке и не имеет нормального демо.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

Opensource http://yallaJS.io

Другие opensource сообщества начали такую же инициативу yallajs. Цель описывается кратко (со страницы github).

«YallaJS упрощает создание HtmlTemplate и рендер его в DOM»

Оба фреймворка пытаются решить одну проблему – создание шаблонов на ES6 Template literal. Главное различие yalla и lithtml в технологии, использованной для разработки и нахождения платформы. lit-html входит в polymer-project (поддержка Polymer в IE9 не входит в их приоритеты), а yallajs пытается обеспечить обратную совместимость с IE9 с лучшей производительностью в своем классе.

Производительность

Ниже представлены графики тестов производительности yallajs. Производительность до сих пор в приоритете для yallajs, но результаты многообещающие.

Изучение Javascript в 2018

По потреблению памяти yallajs также показывает многообещающие результаты.

Изучение Javascript в 2018

Разбор производительности:

Изучение Javascript в 2018

Изучение Javascript в 2018

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

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

Заключение

Прямо сейчас мы можем создать большое JS одностраничное приложение с помощью ES6 функций типа загрузчика модулей и кастомных компонентов без зависимостей от больших фреймворков

Однако для создания полноценного ES6 одностраничного приложения нам все еще необходима библиотека Templating engine

Yallajs – шаблонный движок для ES6 Template Literal, совместимый с IE9 и размером всего лишь 5kb

Тесты производительности и потребления памяти yallajs показывают обнадеживающие результаты

Если коротко, то платформы в выигрыше, а разработчики счастливы. Отличная новость для Jose Aguina/веб-разработчиков. :)

Автор: YallaJS

Источник: https://codeburst.io/

Редакция: Команда webformyself.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее
Самые свежие новости IT и веб-разработки на нашем Telegram-канале

Курс по TypeScript

Прямо сейчас посмотрите курс по TypeScript!

Смотреть курс

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree