Сегодня, 21 апреля в 20.00мск состоится очередной ngRuAir.
Тема: Производительность Angular приложений
https://www.youtube.com/watch?v=KNzDpZlGo7g
Тема: Производительность Angular приложений
https://www.youtube.com/watch?v=KNzDpZlGo7g
YouTube
ngRuAir #7 - Производительность Angular приложений
Собрались обсудить производительность в Angular, разобрать основные ошибки и поговорить о лучших практиках
Состав: TBA
Состав: TBA
Зарелизили [email protected]
Доступны демки для React, Vue, Svelte. Но почему-то оставили без внимания Angular.
Поэтому собрал пример для Angular
Доступны демки для React, Vue, Svelte. Но почему-то оставили без внимания Angular.
Поэтому собрал пример для Angular
Май близок, пока что все согласно релизному плану. Выпустили Angular 8.0.0-rc.0. Изменения можете посмотреть тут: https://github.com/angular/angular/blob/master/CHANGELOG.md
Прямо сейчас идет ngConf
https://www.youtube.com/watch?v=n-RTxeyLbsk
https://www.youtube.com/watch?v=n-RTxeyLbsk
Для тех кто пропустил стрим #ngConf ,
Nitay Neeman в очередной раз собрал все в одном месте.
Описание, слайды, видео каждого доклада:
https://nitayneeman.com/posts/all-talks-from-ng-conf-2019
Nitay Neeman в очередной раз собрал все в одном месте.
Описание, слайды, видео каждого доклада:
https://nitayneeman.com/posts/all-talks-from-ng-conf-2019
Nitay Neeman's Website
Angular – All Talks from ng-conf 2019
A collection of all lectures that were presented during the world’s original Angular conference within one page. Each session includes a concise description and relevant slides.
Скоро скоро выйдет Angular 8.
И вот мои заметки про angular/cli:
- cli по дефолту будет генерировать 2 бандла, под es2015 и es5.
- настройки в browserslist
- в browserslist все еще настройка под googlebot на Chrome 41, хотя уже юзается 74.
- Бандл с enable-ivy, в gzip 40кб
- добавлен web worker в schematics
- отдельный tsconfig для ваших web worker модулей.
и еще много интересных штук ;)
подробнее
И вот мои заметки про angular/cli:
- cli по дефолту будет генерировать 2 бандла, под es2015 и es5.
- настройки в browserslist
- в browserslist все еще настройка под googlebot на Chrome 41, хотя уже юзается 74.
- Бандл с enable-ivy, в gzip 40кб
- добавлен web worker в schematics
- отдельный tsconfig для ваших web worker модулей.
и еще много интересных штук ;)
подробнее
Хотел бы порекомендовать для вас крошечный стеит менеджер для React и Preact — Storeon. Всего 173 байта. На данный момент имеется 2 дополнительных расширения:
-
-
Подробнее можете почитать тут: https://evilmartians.com/chronicles/storeon-redux-in-173-bytes
Причем тут Angular?
Для меня вес конечного бандла имеет значение. Тогда как существующие стеит менеджеры со всем своим обвесом могут достигать в размере более 100кб, Storeon (со своими 173 байтами) кажется очень привлекательным. И все таки 100кб js кода это не 100кб jpeg. К тому же чем меньше сама библиотека требует, тем меньше нужно писать боилерплейта .
Поэтому сделал свою обертку над Storeon — ng-storeon в 526 байтов (что конечно же еще не предел). ng-storeon имеет примерно такой же api как в react / preact версии, только на выходе более привычный Angular разработчикам Observable.
К тому же скоро выпустят предварительную версию Angular Ivy, где пофиксили размер конечного бандла, не 3кб конечно(как показывали 2 года назад), но к этому будет стремиться команда Angular.
Так же собрал ng-storeon вместе Angular Ivy в @angular/[email protected] rc3.
p.s. Пока это писал либа уже успела переехать в
@storeon/angular.
-
@storeon/localstorage позволяет сохранять стеит в localStorage.-
@storeon/crosstab позволяет синхронизировать стеит между вкладками браузера.Подробнее можете почитать тут: https://evilmartians.com/chronicles/storeon-redux-in-173-bytes
Причем тут Angular?
Для меня вес конечного бандла имеет значение. Тогда как существующие стеит менеджеры со всем своим обвесом могут достигать в размере более 100кб, Storeon (со своими 173 байтами) кажется очень привлекательным. И все таки 100кб js кода это не 100кб jpeg. К тому же чем меньше сама библиотека требует, тем меньше нужно писать боилерплейта .
Поэтому сделал свою обертку над Storeon — ng-storeon в 526 байтов (что конечно же еще не предел). ng-storeon имеет примерно такой же api как в react / preact версии, только на выходе более привычный Angular разработчикам Observable.
К тому же скоро выпустят предварительную версию Angular Ivy, где пофиксили размер конечного бандла, не 3кб конечно(как показывали 2 года назад), но к этому будет стремиться команда Angular.
Так же собрал ng-storeon вместе Angular Ivy в @angular/[email protected] rc3.
p.s. Пока это писал либа уже успела переехать в
@storeon/angular.
Буквально через пару минут начнется Angular Air.
Где Stephen Fluin раскажет о текущем состоянии Angular, предстоящей 8 версии. И о том, что ожидается в будущем.
https://www.youtube.com/watch?v=y6pIcDgHd0I
Где Stephen Fluin раскажет о текущем состоянии Angular, предстоящей 8 версии. И о том, что ожидается в будущем.
https://www.youtube.com/watch?v=y6pIcDgHd0I
YouTube
ngAir 204 - State of Angular with Stephen Fluin
Stephen Fluin joins us to give an update on the current state of Angular, the upcoming version 8 release, and what the future holds for the platform.
Angular Fanatic
Наверно, все кто копался в исходниках angular видели этот символ - ɵ в качестве префикса для приватных полей, вот откуда ноги растут - и почему этот символ, а не такой, например, более интересный -🔑 было бы весьма забавно. return new 🔑NoOpAnimationPlayer()…
Сначала ɵ, далее ɵɵ, а теперь аж Δ.
А в спеке совсем #
Когда уже emoji то))
https://github.com/angular/angular/pull/30362
А в спеке совсем #
Когда уже emoji то))
https://github.com/angular/angular/pull/30362
Веб компоненты с Angular Ivy за 6 шагов:
https://www.softwarearchitekt.at/post/2019/05/18/web-components-custom-elements-with-angular-ivy-in-6-steps.aspx
https://www.softwarearchitekt.at/post/2019/05/18/web-components-custom-elements-with-angular-ivy-in-6-steps.aspx
ANGULARarchitects
Architecture with Ivy: A possible future without Angular Modules - ANGULARarchitects
For Ivy, NgModules are optional. This allows us to structure Angular applications with pure EcmaScript techniques like barrels and packages.
ng analytics off
Почему то нигде не увидел анонса этой фичи..
Начиная с 8 версии, будет встроена функция сбора аналитики использования Angular CLI.
При создании проекта будет спрашивать разрешение на включение (или выключение) этой опции.
Так же можно будет вставить свой ключ и шарить в аккаунт Google Analytics.
Почему то нигде не увидел анонса этой фичи..
Начиная с 8 версии, будет встроена функция сбора аналитики использования Angular CLI.
При создании проекта будет спрашивать разрешение на включение (или выключение) этой опции.
Так же можно будет вставить свой ключ и шарить в аккаунт Google Analytics.
Я тут недавно решил пройтись по собеседованиям на позицию фронтенд разработчика, и на одном из них мне задали тестовое задание. Задание довольно интересное, и решил я ее конечно же на Angular. Хочу поделиться с вами этим решением, и объявляю challenge по решению различных фронтовых задач.
По форме ниже вы можете прислать мне задачу, и я постараюсь публиковать решения по интересным задачам. (Все будет реализовано на Angular)
P.s. пожалуйста не нарушайте nda и прочее при публикации
https://docs.google.com/forms/d/e/1FAIpQLSdsRZ8k__peiAoyfzUBnhEY7EsGzQMWxm0xGIyq9Ic7EXfQwQ/viewform
По форме ниже вы можете прислать мне задачу, и я постараюсь публиковать решения по интересным задачам. (Все будет реализовано на Angular)
P.s. пожалуйста не нарушайте nda и прочее при публикации
https://docs.google.com/forms/d/e/1FAIpQLSdsRZ8k__peiAoyfzUBnhEY7EsGzQMWxm0xGIyq9Ic7EXfQwQ/viewform
Google Docs
Решу за вас тестовое;)
Форма для телеграм канала t.iss.one/ngFanatic
Давайте соберем отзывы по использованию NestJS, и напишем свои пожелания, что хотелось бы увидеть, что не устраивает ;)
Спасибо)
(p.s можно на русском)
https://docs.google.com/forms/d/e/1FAIpQLSeu9-EWYL3FlYizZz3GPNc5Zo2gn7YXyNk1EtfLlwKU4nO-5w/viewform
Спасибо)
(p.s можно на русском)
https://docs.google.com/forms/d/e/1FAIpQLSeu9-EWYL3FlYizZz3GPNc5Zo2gn7YXyNk1EtfLlwKU4nO-5w/viewform
Google Docs
NestJS Feedback Form
Ждете пока stackblitz включат поддержку Angular Ivy?
Не надо ждать, Alexey Zuev сделал эту поддержку в ng-run:
https://ivy.ng-run.com
Так же можете посмотреть todo list в нем же:
https://ivy.ng-run.com/edit/GWEOnhuhLkPfbHVdBRib?open=app%2Fapp.component.ts
Не надо ждать, Alexey Zuev сделал эту поддержку в ng-run:
https://ivy.ng-run.com
Так же можете посмотреть todo list в нем же:
https://ivy.ng-run.com/edit/GWEOnhuhLkPfbHVdBRib?open=app%2Fapp.component.ts
Ng-Run
Online angular editor for building demo.
Ivy с нами, пора пилить свои декораторы;)
Elias Sander представил свою версию декораторов life cycle.
@se-ng/ivy-life-cycle-decorators
Кстати, Elias Sander со времён AngularJs отвечает на различные вопросы в Angular форуме. И недавно получил GDE.
https://www.npmjs.com/package/@se-ng/ivy-life-cycle-decorators
Elias Sander представил свою версию декораторов life cycle.
@se-ng/ivy-life-cycle-decorators
Кстати, Elias Sander со времён AngularJs отвечает на различные вопросы в Angular форуме. И недавно получил GDE.
https://www.npmjs.com/package/@se-ng/ivy-life-cycle-decorators
npm
npm: @se-ng/ivy-life-cycle-decorators
Beta notice: This lib is considered beta, until Ivy is the primary renderer in Angular A typescript decorator to be able to use Angular life-cycle hooks in an observable way. Works with Ivy only.
Считаю, что это минимум того что нужно знать при работе с Angular:
https://medium.com/better-programming/19-things-you-need-to-learn-to-become-an-effective-angular-developer-c0ccfa51222a
И в "кривом" переводе на Хабре:
https://habr.com/ru/company/alconost/blog/455906/
https://medium.com/better-programming/19-things-you-need-to-learn-to-become-an-effective-angular-developer-c0ccfa51222a
И в "кривом" переводе на Хабре:
https://habr.com/ru/company/alconost/blog/455906/
Medium
19 Things You Need to Learn to Become an Effective Angular Developer
A comprehensive guide on how to become a pro at Angular
Крутой UI от VMware,
Clarity UI обновилась до 2.
https://clarity.design/news/2.0.0
У ребят очень много идеи, и на это уже нарисованы дизайны. Надеюсь, после усиления команды, они все таки их реализуют.
Clarity UI обновилась до 2.
https://clarity.design/news/2.0.0
У ребят очень много идеи, и на это уже нарисованы дизайны. Надеюсь, после усиления команды, они все таки их реализуют.
clarity.design
Clarity Design System
Clarity Design System. UX guidelines, HTML/CSS framework, and Angular components working together to craft exceptional experiences
Ангуляр в каждый проект!
Если вы еще не видели консольное приложение на Angular, то обязательно взгляните на этот проект от NikPoltoratsky:
https://github.com/Tibing/platform-terminal
а вот тут слайды с конфы.
Если вы еще не видели консольное приложение на Angular, то обязательно взгляните на этот проект от NikPoltoratsky:
https://github.com/Tibing/platform-terminal
а вот тут слайды с конфы.
Когда то давно, (https://t.iss.one/ngFanatic/3) писал что буду публиковать тут еще немного про deno.
Я думаю время настало.
1. В deno теперь зависимости идут таким образом:
core - все что внутри deno
std - набор стандартных пакетов,
x - все остальное, если вы напишите крутой и нужный пакет, то вскоре он попадет в std.
2. Есть вот такой вот условный compat-table
https://deno.dev/wpt/ , но это Web-Platform-Tests for Deno.
3. Думаю пора добавить в compat-table Deno, так как Deno совсем не Nodejs, и там нет его болячек.
4. Есть вот такой online playground: https://deno-play.app/
5. В ближайших релизах хотят плотно поработать над WebAssembly.
6. X пакетов сейчас 55+
7. Общение в основном в gitter, а в телеге тут: https://t.iss.one/denoland
8. Установщик теперь стал более стабильным.
9. Проект все еще эксперементальный, и это не убица Nodejs.
10. Остальное можете узнать с выступлений Раяна.
А еще сделал веб фреймворк для deno, c кучей примеров для ваших экспериментов =)
Alosaur 🦖
https://github.com/irustm/alosaur
Я думаю время настало.
1. В deno теперь зависимости идут таким образом:
core - все что внутри deno
std - набор стандартных пакетов,
x - все остальное, если вы напишите крутой и нужный пакет, то вскоре он попадет в std.
2. Есть вот такой вот условный compat-table
https://deno.dev/wpt/ , но это Web-Platform-Tests for Deno.
3. Думаю пора добавить в compat-table Deno, так как Deno совсем не Nodejs, и там нет его болячек.
4. Есть вот такой online playground: https://deno-play.app/
5. В ближайших релизах хотят плотно поработать над WebAssembly.
6. X пакетов сейчас 55+
7. Общение в основном в gitter, а в телеге тут: https://t.iss.one/denoland
8. Установщик теперь стал более стабильным.
9. Проект все еще эксперементальный, и это не убица Nodejs.
10. Остальное можете узнать с выступлений Раяна.
А еще сделал веб фреймворк для deno, c кучей примеров для ваших экспериментов =)
Alosaur 🦖
https://github.com/irustm/alosaur