😸 Анонс 21 KyivJs Meetup 7 февраля в офисе Wix.

В программе:
- VueJS + rx.js
- JSON RPC
- веб перфоманс в 2019
https://twitter.com/KyivJS/status/1091306617910583296?s=19

#event #javascript

✊ Наконец зарелизился React 16.8, в котором реализовали hooks, о которых говорят вот уже с полгода. Наверное, самое большое изменение в API библиотеки со времен функции createClass. Интересно, куда это заведет экосистему, библиотеки и все реакт-сообщество?

https://reactjs.org/blog/2019/02/06/react-v16.8.0.html

#javascript #reactjs

🦑 Идея zeroconfig, отказ от конфигурирования и дефолты на максималках, иногда доводит до интересных результатов. И вот вам один из них.

zeroserver - веб-фреймворк на Node.js без конфига и бойлерплейта, с роутингом по файлам (привет, PHP!) и автоматическим резолвом зависимостей, даже package.json в базовом использовании не нужен.

https://zeroserver.io/

Просто посмотрите, как это выглядит у них в примерах. Чувствуется влияние современных лямбд в гугл и амазоновских облаках

#javascript

🥤 Если вы больше про фронтенд, то Ден Абрамов продолжает описание лучших практик написания реакт-компонент.

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

https://overreacted.io/writing-resilient-components/

#javascript

💥 Про такое в СМИ обычно пишут что-то вроде "твит сооснователя крупной ИТ-компании взорвал интернет!".

Рабочая группа WebAssembly представила WASI
, набор интерфейсов системного уровня. Кофаундер Docker Соломон Хайкс написал твит:

If WASM+WASI existed in 2008, we wouldn't have needed to created Docker. That's how important it is. Webassembly on the server is the future of computing. A standardized system interface was the missing link. Let's hope WASI is up to the task!

WASI в двух словах от лучших специалистов Evo:

- WASI предоставляет libc, соответственно можно скомпилировать свою программу под WASI libc и она будет работать на этом новом рантайме в любом клауде/OS. Этой фичёй WASI является альтернативой Докеру, но надо всё перекомпилировать, что в принципе не сложно, Alpine Linux тоже этого требует и норм, всё работает. Также WASI имеет свою альтернативу POSIX, и можно будет писать более нативный для WASI код используя новое API, тут у WASI очень интересные перспективы. Рантаймов будет много, можно будет запускать свой код реально везде, секьюрно.

- Это правильный JVM на котором можно без костылей и накладных расходов завести любой язык программирования, а не только адаптированный под JVM. Другими словами -- способ запуска кросс-платформенных приложений с нативной скоростью (т.е. один бинарь и для макоси и для линукса). Думаю лет через 5 это будет дефолтный способ для лямбд. Для нелямбд -- способы деплоя будут делиться на WASI и "старый способ". Примерно как сейчас делится на docker и старый способ (только докер попадёт в один из старых видов).

#javascript

🤼‍♂️ Принес вам два твиттер-треда про перфоманс в JavaScript.

Один про перфоманс серверный, от Юрия Селиванова, core-разработчика Python и базы данных EdgeDB.

Второй от Сары Дреснер, core-разработчицы VueJS, о быстродействии в вебе

#javascript

🐙 GitHub выкатил Package Registry - приватное хранилище для пакетов на разных языках, совместимый с нативными менеджерами пакетов.

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

Пока в бете, поддерживают JS (npm), Ruby (gem), Java (maven), Docker и семейство .Net (nuget).

Говорят, это не конкурент публичным реестрам, но это мы еще посмотрим!

https://github.com/features/package-registry

#javascript #ruby #java #docker #dotnet #wtf #nopython

🏃‍♂️ Інгвар Степанян із CloudFlare написав про новий стандарт BinaryAST, який просуває Mozilla, що дозволяє пришвидшити парсинг js-коду браузером і оптимізувати старт веб-аппів.

Навіщо все це, які складності виникають і як вони реалізували підтримку - можна почитати у їхньому бложику.

https://blog.cloudflare.com/binary-ast/

#javascript

👨‍🔬 Анонс Entropic в текстовой форме: немного истории npm и rationale для (ещё одного) реестра/пакетного менеджера.

https://github.com/ceejbot/economics-of-package-management/blob/master/essay.md

#javascript

💥 Facebook выпустил новый открытый JavaScript-движок, оптимизированный под мобильные устройства.

Заточен под быстрый старт React Native приложений под Android. Интересно куда будут развивать дальше. Так и до браузера своего не далеко.

https://hermesengine.dev/

#javascript

🐭 Проект Pika из инди-бандлера превратился в реестр/CDN/онлайн-редактор ESM-модулей на JavaScript.

Это означает, что там современный JS, с понятными экспортами-импортами. И это можно будет импортить прямо из CDN, без npm install и всех подобных страданий. Обещают, что это будет работать на всех платформах сразу - и под нодой, и в браузерах, и в deno (typescript-based среда выполнения джаваскрипта от первоначального автора ноды)

Чо такое ESM-модули можно почитать тут: https://medium.com/webpack/the-state-of-javascript-modules-4636d1774358

Тред с деталями о Pika: https://twitter.com/pikapkg/status/1196825435671158787?s=19

Выглядит очень интересно, хотя от webpack+babel, боюсь, нам еще долго не уйти.

#javascript

🧙‍♀️Закончились праздники, возвращаемся к нормальному ритму!

Наш лучший специалист Александр Коваль уже достаточно давно делает python DSL для Elasticsearch elasticmagic.

https://github.com/anti-social/elasticmagic
Документация https://elasticmagic.readthedocs.io/en/latest/

По-сути это query builder для эластика, с АПИшечкой вдохновленной SQLAlchemy. В ридми написано very alpha, но мы этим пользуемся уже несколько лет и дико довольны.

А недавно наш лучший специалист Макс Киндрицкий сделал порт этой библиотеки на TypeScript. Теперь и на ноде можно работать с эластиком без слез на глазах

https://github.com/kindritskyiMax/elasticmagic-js

#python #javascript #elasticsearch #project

📕 The Svelte Compiler Handbook - емкое описание основных частей Svelte со ссылками для более детального погружения. Для тех, кто хочет начать разбираться во внутренностях фреймворка или читать (и понимать) его исходники.

https://lihautan.com/the-svelte-compiler-handbook/

#javascript

​​🦕 Вышел первый релиз Deno - рантайм для JS/TS от одного из авторов NodeJS, со слегка новаторским подходом к безопасноти, зависимостям и другими интересными идеями.

https://deno.land/v1
https://blog.logrocket.com/deno-1-0-what-you-need-to-know/
https://www.freecodecamp.org/news/the-deno-handbook/

В твиттере радуются, что у NodeJS появился конкурент. Вспоминают yarn, из-за которого npm начал шевелиться и постят что у deno получилось хорошо сразу

https://twitter.com/rauchg/status/1260705167592157185?s=21
https://twitter.com/roebuk/status/1260879896022220804?s=20
https://twitter.com/MrAhmadAwais/status/1260712169525608452?s=20

#typescript #javascript #node #deno

🥡 На Mozilla Hacks вышла статья о том, как Firefox обновил движок регекспов.

Разработчики SpiderMonkey еще в 2014 году взяли Irregexp, используемый в V8. Но он был достаточно сильно завязан на особенности реализации самого V8.

Тогда мозиловцы взяли код, переписали необходимые куски под свои особенности и жили так несколько лет. Со временем их форк стал отставать от версии в V8, поддерживать свой становилось все сложнее. Тогда ребята решили зайти с новой попытки: взять свежую версию Irregexp, и сделать отдельный слой, абстрагирующий разницу между SpiderMonkey и V8.

Попутно починили пару багов, Irregexp получил новых контрибуторов, у сообщества теперь более переносимый движок регекспов.

https://hacks.mozilla.org/2020/06/a-new-regexp-engine-in-spidermonkey/

#javascript

📦 Вышел отчет-сравнение разных фронтендных сборщиков
https://bundlers.tooling.report/ от авторов web.dev

В обзор попали webpack, rollup, parcel и browserify. Параметров сравнения много: умение в код-сплиттинг, принимаемые форматы модулей, какие форматы модулей умеет продюсить, хеширование, как работает с не js-ресурсами.

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

#javascript

🚝 Через 10 минут онлайн-доклад "Монорепозитории NX и Lerna, или Туда и обратно" от нашего лучшего специалиста Сергея Сафонова. Присоединяйтесь!

https://www.youtube.com/watch?v=7la-K9C2LIo&feature=youtu.be

Текстовая версия доклада на хабре: https://habr.com/ru/post/520186/

#video #javascript

🤛 Сегодня расскажем про новый плагин для eslint'a eslint-plugin-react-use-props. Это приятная мелочь, облегчающая борьбу за перфоманс и чистую кодовую базу.

С его помощью можно указать обязательное использование некоторых props для конкретного компонента.

Пример использования:
Мы активно улучшаем prefomance на проме. Один из важных факторов замедления - это отсутствие у картинок html атрибутов width и height, что приводит к смещению контента во время загрузки страницы и бьет по показателям Cumulative Layout Shift (CLS), т.е. прыгает страница при загрузке (тут подробней https://ax.digital/measuring-cumulative-layout-shift-cls/).

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

{
  "rules": {
    "react-use-props/require": [2,
      { "element": "img", "props": ["width", "height"] },
      { "element": "Image", "props": ["width", "height"] },
      { "element": "Picture.Item", "props": ["width", "height"] }
    ]
  }
}

картинка может быть <img src='' /> , <Image src='' /> , <Picture><Picture.Item src='' /></Picture>.

Также возможность депрекейтить пропсы, что поможет при рефакторинге часто используемого компонента.

{
  "rules": {
    "react-use-props/deprecate": [2,
      { "element": "MyComponent", "props": ["oldProp"] }
    ]
  }
}

Автор плагина - Евгений Марченко, наш лучший специалист по фронтенду. Задавайте ему вопросы в комментариях. Например, "что еще за Image и Picture.Item, Евгений?"

#javascript #evo

📺 Через 10 минут наш лучший специалист Данила Казимиров проведет доклад, в котором расскажет про микрофронтенд на Проме

Трансляция тут https://youtu.be/hQRpMgqZcBA
Старт в 13.30, приходите!

#javascript

🏗 Любопытный новый сборщик esbuild. Обещает собирать статику в 40 раз быстрее вебпака.

Есть поддержка TypeScript, JSX, плагинов и sourceMaps. Можно ставить через пакетный менеджер, есть WASM версия и поддержка Deno. Проект активно развивается и имеет 28к звезд на гитхабе.

Пробовали? Делитесь впечатлениеми в комментариях.

https://github.com/evanw/esbuild

#javascript