Документ рассматривает будущее асинхронного программирования, особенно в контексте JavaScript, и обсуждает различные аспекты, такие как использование промисов, async/await и генераторов. Автор акцентирует внимание на сути асинхронных операций, их преимуществах и недостатках, а также дает ссылки на полезные ресурсы для дальнейшего изучения. В заключение, он делится своим опытом и предлагает советы по улучшению качества кода в асинхронных приложениях.

1. Будущее асинхронного
программирования
Алексей Распопов

2. 2

3. whoami
— 5 лет двигаю кнопки на 3px влево
— Разработчик в DataRobot
— Храню личный говнокод на ГитХабе
3

4. Побочные эффекты (side effects)
Общение с другими сервисами/базами данных, события в
окружении, прочее.
4

5. 5

6. Асинхронное
программирование
Тип параллельных вычислений, который подразумевает, что
операция может быть выполнена кем-то на стороне, за пределами
текущего вычислительного устройства.
Можно выполнять несколько асинхронных операций одновременно.
Результат работы нужно ждать.
6

7. Где в JavaScript асинхронное
программирование?
— HTTP запросы
— Работа с файловой системой
— Таймеры
— События системы и пользователя
— Worker'ы
— ...
7

8. Как мы это делаем?
8

9. 9

10. 10

11. Promise?
11

12. Обещания это
хорошо?
12

13. Все еще коллбеки!
13

14. .then(
get('/resources', (resources) => {
renderResources(resources);
});
get('/resources') (resources) => {
renderResources(resources);
});
01.
02.
03.
01.
02.
03.
14

15. Новый (другой)
синтаксис
15

16. resources
error
// wow
function main() {
try {
let = getResources();
render(resources);
} catch ( ) {
}
}
01.
02.
03.
04.
05.
06.
07.
08.
16

17. resources
error
// wow
function main() {
getResources()
.then(( ) => {
render(resources);
})
.catch(( ) => {
})
}
01.
02.
03.
04.
05.
06.
07.
08.
09.
17

18. 18

19. resources
error
// wow
.finally
// hell yeah
function main() {
getResources()
.then(( ) => {
render(resources);
})
.catch(( ) => {
})
(() => {
})
}
01.
02.
03.
04.
05.
06.
07.
08.
09.
10.
11.
12. 19

20. Angular, что ты
делаешь, ахаха,
прекрати!
20

21. Антипаттерны и сложности
— Размытие сложности по модулю
— Все еще есть задачи в которых приходится писать вложенные
промисы
— Сколько раз вы гуглили статьи по вопросам использования
промисов?
21

22. Хорошие практики
— Переносимость кода
— Поддержка return
— Отсутствие вложенности в 99% случаев
22

23. ECMAScript 20XX
23

24. Статус спецификаций
24

25. async/await
25

26. Асинхронные функции
— Есть в других языках (C#, Python 3.5)
— Поддерживает стандартные операторы языка
— Композиция все еще работает
26

27. resources
error
// wow
function main() {
try {
let = getResources();
render(resources);
} catch ( ) {
}
}
01.
02.
03.
04.
05.
06.
07.
08.
27

28. async
resources await
error
// wow
function main() {
try {
let = getResources();
render(resources);
} catch ( ) {
}
}
01.
02.
03.
04.
05.
06.
07.
08.
28

29. async
await
// ...
return
function a() {
let status;
do {
status = get('/status');
} while (status !== 'COMPLETED');
result;
}
01.
02.
03.
04.
05.
06.
07.
08.
29

30. Как? Хочу прямо
сейчас!
30

31. Генераторы и итераторы
function* numbers() {
yield 1;
yield 2;
return 3;
}
01.
02.
03.
04.
05.
31

32. .next() // 1
// 2
// 3
const iterator = numbers();
iterator ;
iterator.next();
iterator.next();
01.
02.
03.
04.
32

33. function*
yield
yield
Корутины
co( () {
var str = read(‘secret-passwords.txt’);
str = str.replace(‘qwerty’, ‘123456’);
write(‘new-passwords.txt’, str);
});
01.
02.
03.
04.
05.
33

34. npm install co
34

35. browserify code.js
> bundle.js
35

36. co.wrap (name)
// ...
// wow
Async/await уже сегодня
const getResources = (function* {
try {
const data = yield fetch(`/resources/${name}`);
return result;
} catch (error) {
}
});
01.
02.
03.
04.
05.
06.
07.
08.
09.
36

37. 37

38. Async/await и
коллекции
38

39. Еще больше интерфейсов
[1, 2, 3, 4]
.map(n => n * 3)
.filter(n => n < 10)
01.
02.
03.
39

40. Что не так?
— Жрущие память промежуточные результаты
— Еще один интерфейс
40

41. yield
yield
Можно использовать итератор
function* getNames(users) {
for (let user of users)
user.name;
}
function* isAdult(users) {
for (let user of users)
if (user.age > 18) user;
}
01.
02.
03.
04.
01.
02.
03.
04. 41

42. Композиция работает
for (let user of getNames(isAdult(users))) {
render(user);
}
01.
02.
03.
42

43. События —
асинхронная
коллекция
43

44. async iteraton
44

45. async
await
yield
function* getCompanies() {
for (let name of ['Alex', 'Ann', 'Vlad']) {
const profile = get(`/users/${name}`);
profile.company;
}
}
01.
02.
03.
04.
05.
06.
45

46. for await (let company of getCompanies()) {
console.log(company);
}
01.
02.
03.
46

47. Ссылки
— ECMAScript status, process, and documents
— Async/await for ECMAScript
— Asynchronous Iteration for ECMAScript
47

48. Что почитать
— TJ Holowaychuk: Callbacks vs Coroutines
— Jake Archibald: ES7 Async Functions
— Dr. Axel Rauschmayer: What’s in ECMAScript 2016 (ES7)?
— Dr. Axel Rauschmayer: ES6 generators in depth
48

49. 49

50. Спасибо за внимание!
— twitter.com/alexeyraspopov
— github.com/alexeyraspopov
Ссылка на эти слайды:
alexeyraspopov.github.io/es-async-future
50