Zone.js и ChangeDetection. Как render подход повлиял на vuejs, react и angular архитектуры

preview_player
Показать описание
Как VueJS React Angular сообщают о необходимости запуска перерисовки компонента или всего дерева. Как изменения в javascript отлавливаются. В видео я расскажу как это реализовано и ключевые особенности в архитектуре из-за такого подхода.

VueJS пытался решить эту задачу за счет get set javascript дескрипторов
React предложил явно менять состояние через setState но с соблюдением иммутабельности
Angular воспользовался zonejs для решения этой задачи

Как это выглядит в коде смотри в этом видео.

0:00 - Введение
2:09 - VueJS
4:00 - React
6:31 - Angular
10:01 - Выводы
  1. Максим Гром
  2. angular
  3. angular async
  4. angular change detection
  5. angular onPush
  6. angular rxjs
Рекомендации по теме
Zone.js и ChangeDetection. 0:10:30

Zone.js и ChangeDetection. Как render подход повлиял на vuejs, react и angular архитектуры...

WTF is 'Zone.js' 0:13:21

WTF is 'Zone.js' and is it making your app slow?

3.1 Как работает 0:04:28

3.1 Как работает NgZone?

Change Detection in 0:13:03

Change Detection in Angular Pt.2 - The Role of ZoneJS (2023)

How do Angular 0:17:59

How do Angular changes detection works? OnPush, Default, and Zone.js | Smart and Dumb Component

Angular 10 change 0:15:44

Angular 10 change detection - Role of zone js and NgZone

Zone.js and NgZone 0:16:01

Zone.js and NgZone in Angular | Run your code outside Angular

3.3 В чем 0:03:33

3.3 В чем отличие markForCheck() и detectChanges()?

Learn zone.js by 0:48:35

Learn zone.js by Example

Стратегия обнаружения изменений 0:35:45

Стратегия обнаружения изменений в Angular - Максим Иванов

[DevFest Sofia 2019] 0:37:11

[DevFest Sofia 2019] Deep dive into zone.js by Ilia Idakiev

Angular NgZone Explained 0:06:14

Angular NgZone Explained

ChangeDetectionStrategy, OnPush, как 0:21:16

ChangeDetectionStrategy, OnPush, как происходит ререндер | Angular курс

ngOnChanges vs ngDoCheck. 0:18:49

ngOnChanges vs ngDoCheck. ChangeDetectionStrategy OnPush в Angular

Ngzone in Angular 0:07:38

Ngzone in Angular - Improve Performance by Running Code Outside Angular

Angular Change Detection 0:04:19

Angular Change Detection Tuning: Option 3 - Activating/Deactivating Change Detection

Change Detection in 0:51:34

Change Detection in Angular (Change Detection + NgZone)

Change Detection Strategy 0:23:17

Change Detection Strategy in Angular

S3E1 NgZone explained 0:04:02

S3E1 NgZone explained

RuhrJS 2016 - 0:33:18

RuhrJS 2016 - Pascal Precht - Angular 2 change detection explained

Урок 200. Angular. 0:34:20

Урок 200. Angular. Обнаружение изменений

S3E3 What's the 0:04:04

S3E3 What's the difference between markForCheck() and detectChanges()

Profile and optimize 0:11:50

Profile and optimize your Angular 2 apps

Максим Корецкий - 0:49:35

Максим Корецкий - Front end development and change detection

Комментарии
Автор

Привет всем)
Спасибо за обратную связь, лайки и подписки. В видео я не занимаюсь призывами подписаться или написать коммент, но тут я буду)
Приятного просмотра 👍

grommaks
Автор

Очень интересно, спасибо большое. Про Реакт информации много - про виртуальный ДОМ, а вот про Вью и Ангуляр первый раз наткнулась на объяснения какаие-то

ReginaScer
Автор

Быстро, ясно и доходчиво! Спасибо большое за видео!

ЕгорРура
Автор

Спасибо. Очень полезное видео, особенно по Ангуляру, так как в нем не все так очевидно.

Furamy
Автор

Хорошее видео. И звук 👍Сам начал ролики записывать.

Kulibins
Автор

Уровень монтажа на высоте! Очень круто подал материал. В плейлисте по DI использовал jsDoc мог бы сделать туториал по jsDoc?

taras
Автор

Только markforcheck не запускает перерисовку, а помечает, что когда очередной цикл, обновления будет спрашивать, нужно ли перерисовать, то перерисует.

Kulibins
Автор

Интересная перспектива. Спасибо. Совет от подписчика - слово фреймвЁрк очень режет ужо, прям отвлекает от просмотра.

ВиталийБоднар-ея
Автор

ты знал такой прикол в css? #c6ced699 формат rgba последння 99 указывает на прозрачность, чем меньше, тем больше прозрачность. Очень крутая штука, это не все знают

romanryaboshtan