3 библиотеки JavaScript, за которыми нужно следить в 2017 году

Чтобы начать, вы можете установить его с помощью npm: npm install conditioner-js Более подробную информацию можно найти на домашней странице проекта .

Это демо в отличие от предыдущих, чтобы лучше проиллюстрировать возможности Conditioner.js. Представьте, что мы хотим показать время, оставшееся до события. Модуль для этого может выглядеть так:

 import moment from 'moment';

export default class RelativeTime {
  /**
   * Enhance given element to show relative time.
   * @param {HTMLElement} element - The element to enhance.
   */
  constructor(element) {
    this.startTime = moment(element.datetime);

    // Update every second
    setInterval(() => this.update(), 1000);
    this.update();
  }

  /**
   * Update displayed relative time.
   */
  update() {
    element.innerHTML = this.startDate.toNow();
  }
}

Инициализация этого модуля так же проста, как:

 <time datetime="2017-01-01" data-module="ui/RelativeTime">2017</time>

Затем кондиционер загрузит модуль ui/RelativeTime Обратите внимание, что контент уже присутствует и находится в приемлемом формате, и модуль только усиливает это.

Если вы хотите, чтобы модуль инициализировался только тогда, когда он виден пользователю, вы можете сделать это с условиями:

 <!-- Show RelativeTime only if it is visible to the user -->
<time datetime="2017-01-01" data-module="ui/RelativeTime" data-conditions="element:{visible}">2017</time>
<!-- Keep showing RelativeTime after it was visible to the user -->
<time datetime="2017-01-01" data-module="ui/RelativeTime" data-conditions="element:{was visible}">2017</time>

Conditioner.js имеет довольно обширный список мониторов, которые вы используете для определения условий. Не волнуйтесь! Вам нужно только включить те, которые вам нужны, чтобы предотвратить включение ненужного кода.

Вы также можете передавать параметры в виде строки JSON или чуть более читаемого варианта JSON.

 <!-- JSON variant -->
<div data-module="ui/RelativeTime" data-options='unit:"seconds"'>...</div>
<!-- Or good old JSON -->
<div data-module="ui/RelativeTime" data-options='{"unit":"seconds"}'>...</div>

Причины использовать или избегать Conditioner.js аналогичны Svelte: если вы заботитесь о площади своего приложения, вам определенно следует рассмотреть возможность использования этой библиотеки. С другой стороны, будущее библиотеки неясно, так как никакие планы на будущее не были объявлены. Conditioner.js позволяет вам определять пользовательские мониторы, позволяя заставить его работать при любой сложной загрузке модуля.

По умолчанию Conditioner.js совместим с браузерами, которые поддерживают ES5. Подобно Vue.js и Svelte, лучшая совместимость может быть достигнута с помощью специальных прокладок ES5 .

Для получения дополнительной информации посетите веб-сайт Conditioner.js или его репозиторий GitHub .

Вывод

Я думаю, что эти фреймворки и библиотека будут хорошими в 2017 году. Хотя я не фанат фреймворков, я считаю, что и Vue.js, и Svelte предпринимают шаги в правильном направлении для решения проблем, существующих в существующих фреймворках, что может привести к тому, что отрасль переход к новым способам построения или определения вещей. Любое улучшение — это изменение, которого я жду с нетерпением.

У меня сложилось впечатление, что создание приложений на основе компонентов рассматривается как путь. Хотя я не ожидаю, что в результате Conditioner.js произойдет серьезный сдвиг, он определенно решает проблемы, которые, на мой взгляд, довольно часто встречаются в компонентных приложениях, что делает его отличным дополнением для более сложной загрузки.

Какие библиотеки вы ожидаете, чтобы быть отличным в 2017 году? Пожалуйста, дайте нам знать ваши мысли в разделе комментариев!