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

1. Ôðîíòåíä ñêàçêè
Åâãåíèé Æàðêîâ

2. Как бывает на
собеседованиях?
- Опишите свой опыт?
- Ну, я уже не первый год занимаю JS-разработкой.
Использовал Prototype, jQuery, Backbone, Knockout,
Angular, React, TypeScript, ковырял Elm.
- А как на счет чего-то другого, Vue?
- (>_<)

3. Как бывает на
собеседованиях?
- Вот, наш реальный проект, десятки файлов, мы тебе за 10
минут объясним структуру, ты должен будешь сделать новый
скрин, переиспользуя существующие компоненты.
…проходит 1 час
- Ребята, почти ничего не получилось.
- Нужно было сделать правки в 3-х строках, извините вы нам
не подходите.

4. Про выбор

5. Как начинают новые проекты?
• ищем, новые фреймворки или новые версии старых
• сравниваем, читаем обзоры
• иногда читаем глупые сравнения
• иногда делаем простые прототипы
• смотрим на эко-систему
• просматриваем исходники OSS-компонентов, но это не точно.
• оценивают риски

6. Это был идеальный мир

7. Реальность

8. Я подписан на Зафода Библброкса,
классный парень, он использует XYZ.
***
XYZ получил 2000 звезд на гитхабе!
***
Ну ты видел какой To-Do List на XYZ?

9. Утерянный твит.
“Я написал свое первое приложение на Elm!
Оно для жены. Это так просто! <ссылка>”

10. Мои мысли.
Сколько твитов про Elm, все вокруг
используют, крутая штука.

11. Мои действия.
Открываю приложение. Статический Home
Page на 5 текстовых разделов с картинками.

12. Моя реакция.

13. Окружите себя людьми из одной технологии и
будет ощущение, что это - мейнстрим.

14. Из пустого в порожнее

15. Medium
“At Rever (www.reverscore.com) we just released a
new version of our web client using Vue.js. After
641 commits and 16 weeks of intense development
here we are, very proud of a decision we took a
while ago.”

16. Medium
“8 months ago our web client was using Angular 2.
To be precise, it was using Angular 2 beta 9.”

17. Medium
“Before I continue, I admit that Angular 2 beta 9 is a
different product than Angular 2.0, but that was
exactly one of the problems. From beta9 to 2.0.0
there are 8 beta versions, 8 RC and the 2.0.0
version itself, 17 versions to upgrade in total.”

18. Medium
“We did try to upgrade from beta 9 to 2.0.0 but too
many things broke that made the upgrade non
trivial.”

19. Medium
“The main thing we didn’t like
and we still don’t like about
Angular 2 is Typescript.”

20. Medium
“At Rever (www.reverscore.com) we just released a
new version of our web client using Vue.js. After
641 commits and 16 weeks of intense
development here we are, very proud of a decision
we took a while ago.”

21. 16 недель
4 месяца
80 дней*

22. *реальность
Какие переработки?
8 рабочих часов в день?
Ребят, нужно поднажать, мы команда!
Зачем тебе 2 выходных в неделю?
Какой крутой фреймворк!
Зачем мне 1 выходной в неделю?
У Питера нет отношений, поэтому за уикенд он сделал
работы еще на 20 часов.
У нас Agile/Kanban, но дэдлайн.

23. webpack

24. “Я потратил 2 дня, чтобы мигрировать простой
конфиг, с webpack 1 на webpack 2”

25. “Потому что плагин, который мне нужен не
умеет делать ‘это’ для старой версии”

26. “Могу написать свой плагин, думаете быстрее
будет?”

28. 440 часов
55 дней*

29. *реальность
День 1. Сейчас сяду и всё перепишу, неделя
максимум.
День 10. Были небольшие проблемы, но в целом
всё хорошо.
День 20. Хелен, у нас почти все готово,
осталось пару дней.
День 30. Отрицание.
День 31. Гнев.
День 32. Торг.
День 33. Депрессия.
День 34. Принятие.
День 55. Релиз.

30. Счастливый разработчик пишет в твиттер, как
круто все прошло

32. Про архитектуру

33. Вымышленная цитата, невымышленный проект.
“Я был на проекте, там был React и Redux,
производительность просто никакая, лучше бы
на *** сделали”

34. Дано:
1. Форма на 4 текстовых поля.
2. Задержка между набором текста в поле и
его отображении на экране до 5 секунд.

35. Текстовое поле
onKeydown
Redux State
Copy Redux
State to tmpState
reducer
сотни полей
1 изменение
onSubmit

37. Вымышленная цитата, невымышленный проект.
“Я был на проекте, там был React и Redux,
страница прорисовывалась ~10 секунд”

39. Socket
UI
BATCH FETCH
по 200 записей
10 секунд
Page Load

41. 3 месяца, чтобы понять бизнес логику
и сделать загрузку за 500мс.

42. Про компоненты

43. Я
“Сейчас возьму Bootstrap / Material UI и по
быстрому все накидаю”
1.

44. Я
“Как все библиотеки еще в beta и там не все
реализовано?
2 года же прошло.”
1.

45. Я
День 1. Начало работы create-react-native-app
“Ох, как круто, create-react-native-app позволяет
делать все очень просто.”
2.

46. Я
День 2. Конец работы с create-react-native-app
“Ага, чтобы подключить нормальный роутер,
нужно теперь все делать руками.”
2.

47. Я
“Что там с роутерами у ReactNative?”
3.

48. Google
3.
Первый!
react-native-router
Вы все
неправильно
делаете, нужен
native, а не JS!
WIX/react-native-navigation
Ребята, у нас
лучше, но мы
бета, лучше нас не
использовать, но
мы круче
Airbnb/native-navigation

49. Выводы:

50. 1. Цена ошибки - время

51. 2. Время - самый ценный
ресурс

52. 3. Бизнесу и пользователю
нужен рабочий продукт

53. Рабочий продукт != идеальный код

54. Рабочий продукт !=“перепишем все на XYZ”

55. Нет времени писать тесты.
У стартапов

56. Нет бюджета писать тесты.
У энтерпрайза