Приветствую всех любителей JavaScript! Поскольку по-прежнему лучше оставаться дома, мы собрали несколько интересных новостей о JavaScript, чтобы вы были в курсе последних обновлений интерфейсных технологий и подняли настроение.

Этот месяц стал весьма продуктивным для команды DHTMLX, поскольку мы выпустили крупное обновление нашего ключевого продукта DHTMLX Gantt 7.0, и вы узнаете больше об этой новинке ниже.

Кроме того, в этом дайджесте вы узнаете, как сгенерировать структурированные данные с помощью JavaScript, познакомитесь с новым фреймворком JavaScript Crank.js и новыми функциями в Node.js 14.0, узнаете, как разработчики JavaScript могут помочь в борьбе с COVID-19 и что чего ожидать от ES2020 и Bootstrap 5. На десерт мы поделимся с вами некоторыми полезными уроками и ценными советами, которые сделают ваш поиск знаний JavaScript немного проще.

Вот так!

Новые инструменты и обновления

Новое руководство Google по созданию структурированных данных с помощью JavaScript

Google недавно опубликовал новое руководство для разработчиков на странице Google Developers. Этот документ дает хорошее представление о том, как создавать структурированные данные с помощью JavaScript и как реализовать их на веб-сайте, или, скорее, как это сделать правильно, чтобы это могло принести пользу в поиске Google. В общем, в руководстве описаны три метода динамического добавления структурированных данных на веб-сайт с помощью JS: Диспетчер тегов Google, пользовательский JS и рендеринг на стороне сервера. В настоящее время использование JavaScript является обязательным условием для создания веб-сайта с расширенной функциональностью. Таким образом, эти советы будут особенно полезны для веб-разработчиков и SEO-специалистов.

Что нового в DHTMLX диаграмме Ганта версии 7.0

В этом месяце наша команда разработчиков наконец дала зеленый свет основному выпуску DHTMLX Gantt. Новая версия 7.0 предлагает несколько важных улучшений, которые пригодятся для расширения функциональности нашей диаграммы Ганта в любом приложении для управления проектами.

В дополнение к нескольким важным обновлениям на стороне клиента, таким как объединение нескольких календарей, новые параметры конфигурации для столбцов сетки и обновленная политика безопасности контента, новый компонент DHTMLX Gantt также принял новаторский серверный модуль Gantt для Node.js.

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

Node.js получает серьезное обновление

Команда разработчиков Node.js недавно представила крупное обновление своей популярной инфраструктуры Node.js, предлагая среду выполнения JavaScript для написания серверных приложений на JavaScript. Новая версия 14.0 предоставляет множество интересных функций, которые, безусловно, укрепят арсенал веб-разработчиков. В список наиболее заметных нововведений версии 14.0 вошли: расширенная диагностика, модифицированный JS-движок, улучшенная согласованность потоковых API. Новая версия также предлагает некоторые специфические экспериментальные функции, такие как реализация интерфейса системы веб-сборки, API асинхронного локального хранилища и модули ES.

Следует отметить, что Node.js 14.0 не готов к работе до тех пор, пока он не будет переведен в статус долгосрочной поддержки (LTS), запланированный на октябрь 2020 года. До тех пор разработчики могут экспериментировать с последними функциями Node.js 14 и сообщать обо всех обнаруженных проблемы, чтобы их можно было исправить до перехода на LST. Чтобы узнать больше об этом основном выпуске, ознакомьтесь с этим сообщением в блоге.

Nextstrain ищет разработчиков JS для борьбы с COVID-19

Nextstrain, международный некоммерческий проект, направленный на создание инструментов визуализации для мониторинга и анализа развития и распространения патогенных микробов, призвал разработчиков JavaScript протянуть руку помощи в обновлении своего интерактивного веб-приложения под названием Auspice.

В последнее время это приложение широко используется для иллюстрации эволюции и географического распространения COVID-19. Каждую неделю команда Auspice публикует отчеты о ситуации с описанием распространения коронавирусной болезни. Эта информация позволяет вирусологам и другим специалистам анализировать и наблюдать за изменением возбудителя.

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

Представляем Crank.js Framework

Если вы ищете какой-то новый подход к созданию компонентов на основе JSX, вам обязательно стоит обратить внимание на Crank.js. Этот новый фреймворк можно рассматривать как альтернативу основным библиотекам JSX (таким как React или Preact), позволяя создавать компоненты на основе JSX с помощью функций, обещаний и генераторов. Crank.js не требует использования хуков, классов или прокси, что значительно упрощает процесс отладки. Благодаря поддержке обещаний, Crank.js позволяет использовать async / await прямо в компонентах, а также компоненты гонки для отображения резервных пользовательских интерфейсов. Если вас интересуют более подробные сведения об этом замечательном фреймворке и вы хотите узнать полную историю его создания, загляните в Блог Crank.js.

Чего ожидать от грядущего Bootstrap 5

Bootstrap - одна из самых популярных интерфейсных сред, включающая широкий спектр компонентов пользовательского интерфейса (HTML, CSS, JavaScript) для реализации веб-проектов. Статистика говорит, что примерно пятая часть всех веб-сайтов создается с помощью Bootstrap, который в этом году, как ожидается, будет обновлен до новой версии 5.0.

Официальная дата выхода этого крупного обновления до сих пор не объявлена, но список ожидаемых изменений выглядит интригующим. Прежде всего, предстоящий Bootstrap не будет поддерживать jQuery и Internet Explorer 10/11. Это огромный шаг со стороны команды Bootstrap, но для таких радикальных мер есть веские причины:

  • jQuery уступает другим современным фреймворкам JavaScript с точки зрения производительности и удобства сопровождения кода.
  • Браузеры Internet Explorer 10/11 не поддерживают современные стандарты JavaScript и вряд ли могут конкурировать с другими популярными браузерами (Chrome, Firefox, Edge).

Среди других заметных изменений мы также должны упомянуть следующее: добавление гибких размеров шрифта, оптимизация навигационной панели, новая библиотека значков SVG, обновления классов CSS, переключение с Jekyll на Hugo.

В целом, можно предположить, что мы не увидим значительных изменений в базовом наборе компонентов, реализованных в Bootstrap 5, но фреймворк обещает стать быстрее, проще и красивее.

Окончательный список функций ES2020

ECMAScript - широко используемая спецификация языка программирования, наиболее популярной реализацией этого стандарта является JavaScript. В этом месяце комитет TC39 представил окончательный пакет функций для 11-й редакции ECMAScript, известной как ES2020. В настоящее время версия ES2020 имеет статус кандидата. Он был внесен на рассмотрение и дальнейшее принятие ГА ECMA на ежегодном собрании в июне 2020 года.

Список возможностей включает 10 интересных дополнений к ES2020, начиная от нового метода import () и заканчивая динамической загрузкой JS-модулей и новым примитивным типом данных BigInt для работы с большое количество. Каждая предлагаемая функция прошла 4 стадии зрелости, прежде чем быть включена в окончательный набор функций, что исключает возможность возникновения каких-либо проблем с безопасностью. Интересно отметить, что большинство нововведений уже поддерживаются в современных браузерах, но они станут официальной частью JavaScript только после окончательного утверждения.

Полезные советы и статьи

Настройка исходных карт для отладки производственного JavaScript

Иногда разработчики JavaScript могут испытывать значительные трудности с отладкой ошибок JavaScript в производственной среде. Дело в том, что многие разработчики часто пишут код в надмножествах JS (TypeScript, Dart и т. Д.), Который затем преобразуется в JavaScript с помощью транспиляторов для использования в браузере. Транспилированный код сильно отличается от исходного исходного кода, используемого для написания приложения, поэтому обнаружение ошибок становится сложной и трудоемкой задачей.

Вот тут-то и вступают в игру исходные карты. Исходные карты - это файлы JSON, которые помогают вернуть преобразованный код в исходную форму и ускоряют процесс отладки кода JavaScript. Однако настройка исходных карт может быть довольно сложной, но, к счастью, вот учебник с полезными рекомендациями о том, как сделать это правильно и воспользоваться преимуществами использования исходных карт.

Советы по оптимизации производительности для приложений на базе Angular

Angular - популярная платформа на основе TypeScript, используемая миллионами интерфейсных разработчиков для создания полнофункциональных веб-приложений. Несмотря на то, что эта распространенная технология значительно упрощает и ускоряет процесс разработки, разработчики часто сталкиваются с проблемой низкой производительности. Это происходит в основном, когда разработчики добавляют слишком много сложного контента в свои приложения, применяют плохие методы кодирования или слишком часто обновляют их. Низкая производительность может стать большим ударом по популярности любого приложения. Воспользуйтесь этими 14 ценными советами, чтобы ваше приложение на основе Angular оставалось быстрым и отзывчивым.

Как создать приложение для построения диаграммы Ганта на Vue.js

Диаграмма Ганта - важный инструмент для планирования и составления графика проектов любого масштаба. Этот инструмент позволяет менеджерам проектов оценивать временные рамки проекта, назначать задачи участникам проекта, отслеживать рабочую нагрузку, управлять зависимостями между задачами и использовать многие другие полезные функции для успешного завершения своих проектов. Если вам нужно подробное руководство с пошаговыми инструкциями по созданию приложения диаграммы Ганта для вашего проекта, команда DHTMLX предложила вам отличное решение. Посмотрите это отличное видео-руководство, и вы узнаете, как это правильно делать, используя Vue.js и DHTMLX Gantt. Вот также ссылка на наш репозиторий GitHub, где вы найдете исходный код компонента диаграммы Ганта для Vue.js.

Советы и хитрости GitHub от Githubbers

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

Простой способ добавить анимацию частиц на свой веб-сайт

Анимация частиц может стать отличным дополнением к вашему сайту. И хорошая новость в том, что вам не нужно быть гуру графического программирования, чтобы реализовать эту привлекательную конструктивную функцию. В этом руководстве Анна Пренцель покажет вам, как анимировать ваш проект, используя некоторые базовые знания интерфейсных технологий и интуитивно понятную библиотеку JavaScript с именем anime.js.

Стратегии перехода с JavaScript на TypeScript

Не секрет, что в настоящее время JavaScript является одним из наиболее широко используемых языков программирования в мире, и его популярность продолжает расти. Это чрезвычайно гибкий и простой в изучении язык с расширенными функциями и огромным сообществом. JavaScript - отличный выбор для небольших проектов кодирования, но когда дело доходит до крупных проектов, разработчикам часто бывает трудно отладить JS-код.

Поэтому, когда ваш JS-проект становится слишком большим и сложным, может быть разумным подумать о переносе кодовых баз с JavaScript на TypeScript. Используя TypeScript, можно решить проблему сложности кода и эффективно обнаруживать ошибки во время разработки и во время компиляции, делая код более простым, чистым и согласованным. Перенос огромных баз кода может показаться сложной и трудоемкой задачей, но после прочтения этого сообщения в блоге о стратегиях миграции вы обязательно найдете правильное решение.