Препарируем JavaScript и лечим родовые травмы
Валентин Ульянов
Препарируем JavaScript
и лечим родовые травмы
Обо мне
- В IT больше 10 лет
- Делал отечественный Office, бэкенд и инструменты разработки на JS/TS
Обо мне
- В IT больше 10 лет
- Делал отечественный Office, бэкенд и инструменты разработки на JS/TS
- Разрабатываю open source проект
Обо мне
- В IT больше 10 лет
- Делал отечественный Office, бэкенд и инструменты разработки на JS/TS
- Разрабатываю open source проект
- Выступаю на конференциях и веду
IT-сообщество в Питере на 1000+ человек
Обо мне
- В IT больше 10 лет
- Делал отечественный Office, бэкенд и инструменты разработки на JS/TS
- Разрабатываю open source проект
- Выступаю на конференциях и веду
IT-сообщество в Питере на 1000+ человек
Я и JavaScript
- Первый опыт с JS был в 2013
Я и JavaScript
- Первый опыт с JS был в 2013
- Писал разное: фронт, бэк, инструменты
Я и JavaScript
- Первый опыт с JS был в 2013
- Писал разное: фронт, бэк, инструменты
- Сделал 3 библиотеки на JS/TS
Я и JavaScript
- Первый опыт с JS был в 2013
- Писал разное: фронт, бэк, инструменты
- Сделал 3 библиотеки на JS/TS
- Работал с проектом на 1 500 000 строк кода
Содержание
- Проблемы развития JS-разработчика
- Что может помочь
- Продвинутый JavaScript
- Применение на практике
- Заключение
Системный код - код, который нужен для работы другого кода. Библиотеки, фреймворки, утилиты, etc
Системный код - код, который нужен для работы другого кода. Библиотеки, фреймворки, утилиты, etc
Прикладной код - программа для решения задач предметной области. Сервис доставки, интернет-магазин, онлайн-банк, etc
Проблемы развития JS-разработчика
Можно проще?
Можно проще?
Стандартные паттерны
- В JS плохо применимы "в лоб" - нужно адаптировать
Стандартные паттерны
- В JS плохо применимы "в лоб" - нужно адаптировать
- Некоторые теряют актуальность
Динамический метод
Возможность вызвать у объекта метод, который не определен в коде явно
Динамический метод
- Убирает бойлерплейт
- Делает код более читабельным
Динамический метод
- Убирает бойлерплейт
- Делает код более читабельным
- Добавляет гибкости
Перегрузка операторов
Возможность изменять логику работы оператора при взаимодействии с различными типами данных
Перегрузка операторов
- Убирает бойлерплейт
- Делает код более читабельным
GigaScript
- Синтаксис максимально близок к JS
GigaScript
- Синтаксис максимально близок к JS
- Cтатическая типизация и лучший вывод типов
GigaScript
- Синтаксис максимально близок к JS
- Cтатическая типизация и лучший вывод типов
- Компилируется в JS
GigaScript
- Синтаксис максимально близок к JS
- Cтатическая типизация и лучший вывод типов
- Компилируется в JS
- Лучшие практики дизайна языков в 2026
Слабые стороны
- Есть этап компиляции
- Этого языка не существует
Продвинутые возможности
- Цепочка прототипов
Proxy
Symbol.toPrimitive
Прототипное наследование
Возможность экземпляров иметь доступ к цепочке прототипов-предков и использовать свойства и методы из них
Proxy
Класс, экземпляр которого является оберткой над переданым объектом, способной отслеживать взаимодействия с ним
Symbol.toPrimitive
Символьный метод, позволяющий отслеживать преобразование
объекта к примитиву
Symbol.toPrimitive
object.valueOf()
object.toString()
Кейсы
- Базовый класс для entity в DDD
Кейсы
- Базовый класс для entity в DDD
- RPC для взаимодействия документов в офисном редакторе
Кейсы
- Базовый класс для entity в DDD
- RPC для взаимодействия документов в офисном редакторе
- Работа с value objects
Кейсы
- Базовый класс для entity в DDD
- RPC для взаимодействия документов в офисном редакторе
- Работа с value objects
Кейсы
- Базовый класс для entity в DDD
- RPC для взаимодействия документов в офисном редакторе
- Работа с value objects
События в редакторах
- Локальные - в одном документе
События в редакторах
- Локальные - в одном документе
- Глобальные - во всем приложении
Глобальные события
DocumentBeforeClose
DocumentBeforePrint
Глобальные события
DocumentBeforeClose
DocumentBeforePrint
DocumentChange
Глобальные события
DocumentBeforeClose
DocumentBeforePrint
DocumentChange - переключение активного документа
RPC для взаимодействия документов
- Реализации фич в макросах - глобальные события и настройки
RPC для взаимодействия документов
- Реализации фич в макросах - глобальные события и настройки
- Вызов метода API одного документа в макросе другого
Модуль для RPC
- Универсальный - использоваться в любом из офисных редакторов
Модуль для RPC
- Универсальный - использоваться в любом из офисных редакторов
- Легко расширяемый - без изменения кода нужно задавать разрешенные методы API
Модуль для RPC
- Универсальный - использоваться в любом из офисных редакторов
- Легко расширяемый - без изменения кода нужно задавать разрешенные методы API
- Слабо связанный - все настройки передаются извне
Сильный инженер не пишет типовой код
Модуль для RPC
Documents - array-like абстракция для работы с коллекцией открытый документов
Кейсы
- Базовый класс для entity в DDD
- RPC для взаимодействия документов в офисном редакторе
- Работа с value objects
Преимущества продвинутого JS
Преимущества продвинутого JS
- Повышается качество кода
- Избавляемся от зависимостей и/или уменьшаем размер бандла
Преимущества продвинутого JS
- Повышается качество кода
- Избавляемся от зависимостей и/или уменьшаем размер бандла
- Расширяем кругозор, прокачиваемся как инженер
Минусы
- Повышается порог вхождение
Минусы
- Повышается порог вхождение
- Может ухудшаться производительность
Минусы
- Повышается порог вхождение
- Может ухудшаться производительность
- Не для каждого стека
Выводы
- JS не сломан, с ним все норм
Выводы
- JS не сломан, с ним все норм
- Осваиваем однажды - становимся продуктивнее навсегда
Выводы
- JS не сломан, с ним все норм
- Осваиваем однажды - становимся продуктивнее навсегда
- Следите за развитием языка
Выводы
- JS не сломан, с ним все норм
- Осваиваем однажды - становимся продуктивнее навсегда
- Следите за развитием языка
- Смотрите на другие языка и воруйте из них фичи
Вопросы?
Телеграм-канал: