Авторы этой статьи Марин Алькарас и Рэй Сон для блога Wootric.

TypeScript заставил нас задокументировать весь набор флажков и переключателей функций. У нас есть много флагов для различных функций, и с помощью интерфейсов у нас больше не может быть загадочных недокументированных флагов. Все флаги должны быть в интерфейсе, иначе компилятор нас предупредит. Это позволяет разработчикам быть честными.

Мы в Wootric уже некоторое время являемся поклонниками Typescript. Андерс Хейлсберг, ведущий архитектор TypeScript, имеет легендарный опыт работы над удивительными языками, такими как Turbo Pascal и C#. Давняя мечта команды состояла в том, чтобы перевести наш фрагмент JavaScript на TypeScript. Наш фрагмент JavaScript — это то, что отображает наш всплывающий опрос в браузерах. И в начале этого года мы начали экспериментировать со способами достижения этой цели. Были некоторые препятствия и ошибки, но нам удалось их преодолеть, и теперь фрагмент компилируется из TypeScript в JavaScript. У нас есть типы!

Продолжайте читать, чтобы узнать больше об этом путешествии.

Почему мы переписали это

В индустрии программного обеспечения полное переписывание обычно не одобряется и считается пустой тратой времени, но простой JavaScript уже не подходил. Не все в нашей команде являются экспертами по JavaScript, и в JavaScript есть много подводных камней. Переход на язык с типами облегчил бы большую умственную нагрузку и обеспечил бы соблюдение базовых интерфейсов. Нам нравится думать о проверке типов как об автоматизированном корректоре, гарантирующем, что вы расставите точки над i и зачеркнете ts, прежде чем выпускать производственное программное обеспечение, которое используется миллионами. Согласно этому исследованию, 15% ошибок JavaScript можно обнаружить с помощью TypeScript.

Миграция кода на новый язык обычно очень сложна, но, поскольку TypeScript является надмножеством JavaScript, это сделало переход намного проще, чем перевод на язык с совершенно другим синтаксисом. Еще одна особенность TypeScript, которая упростила миграцию, — это «любой» тип, который служит заполнителем для типа. Мы постепенно движемся к запрету «любого», но плюсом является то, что «любой» тип позволил нам перенести всю кодовую базу без необходимости добавлять типы ко всему. Компилятор TypeScript действовал как наш корректор и заполнял типы, пока мы не дошли до их добавления.

От улучшения нашей инфраструктуры сборки до предоставления нам гарантий благодаря своим типам — вот проблемы, которые у нас были, и TypeScript помог нам решить:

  • Поддерживать инфраструктуру компилятора Almond.js было обременительно. Разные сборки означали разные файлы и разные тесты. Нам также приходилось писать много простого текста в эти файлы. Позже этот текст был оценен как JS из-за модульной системы AMD.
  • Поддержание сторонних библиотек в актуальном состоянии было ручным процессом. Теперь мы используем package.json и просто импортируем библиотеки с помощью оператора импорта. В прошлом мы напрямую извлекали сторонние файлы из нашего локального репозитория, чтобы объединить их во фрагмент, если мы хотели обновить библиотеку, нам нужно было обновить файл вручную. Теперь мы запускаем `yarn upgrade` и готовы к работе!
  • Нам нужно было улучшить поддержку нашего старого браузера и обеспечить гарантии. TypeScript имеет флаг компилятора, который позволяет нам работать со старыми браузерами. Таким образом, мы можем гарантировать нашим клиентам, что наш SDK работает в браузерах ES3 и выше.
  • Несколько ошибок, которые были в исходном коде некоторое время:
  • Компилятор обнаружил функцию, которая должна была возвращать логическое значение, но ничего не возвращала. Мы использовали эту функцию в операторе if, и компилятор предупредил нас, что функция не возвращает логическое значение.
  • Используя интерфейсы, мы обнаружили, что наша конфигурация содержит внутри себя повторяющийся объект конфигурации. Используя рекурсивные интерфейсы, мы смогли определить это необычное свойство.
  • После добавления сигнатур типов в нашу внутреннюю очередь приоритетов компилятор сообщил нам, что некоторые из наших функций имеют несоответствия возвращаемых значений. Некоторые части нашего кода ожидали промисов и не получали их. Это привело нас к обнаружению серьезной ошибки в коде.

Вывод

Вы не можете просто выбрать новые языки и принудительно добавить их в свой стек. Вы должны оценить компромиссы и взглянуть на плюсы и минусы, которые принесет новый инструмент. В наших проектах TypeScript это результаты, и мы считаем, что компромиссы того стоят.

Плюсы

  • Меньший размер вывода, и это здорово, поскольку мы хотим, чтобы наш JavaScript SDK был как можно более легким, чтобы не влиять на производительность приложения нашего клиента.
  • TypeScript заставил нас задокументировать весь наш ассортимент флажков и переключателей функций. У нас есть много флагов для различных функций, и с помощью интерфейсов у нас больше не может быть загадочных недокументированных флагов. Все флаги должны быть в интерфейсе, иначе компилятор нас предупредит. Это позволяет разработчикам быть честными.
  • Повышенная ремонтопригодность, потому что SDK становился настолько большим, что вносить большие изменения было очень страшно, и мы могли вызвать регрессию. Напечатав все, мы можем с большей уверенностью провести рефакторинг.
  • Поначалу трудно не писать точки с запятой, но через некоторое время вы задаетесь вопросом, зачем вообще нужно было их писать.
  • @types теперь зрелый, и каждая библиотека, которая нам нужна, имеет типы, зарегистрированные с помощью Definitely Typed.
  • Наличие кодовой базы, которая делает вашу работу проще и интереснее, которую часто упускают из виду и недооценивают, — это победа для команды инженеров. У TypeScript отличный инструментарий, и мы этому очень рады.

Минусы

  • Время сборки стало медленнее, но мы начинаем исправлять это с помощью таких руководств, как этот один.
  • Разработчикам необходимо осваивать совершенно новый язык, цепочку инструментов и соглашения.
  • Новый набор проблем. Познакомившись с версией нашего фрагмента кода на JavaScript, мы часто знали, где искать, когда что-то ломалось с помощью всего нескольких указателей. После перехода на TS мы столкнулись с одной ошибкой, которая была напрямую связана с коммутатором, и нам потребовалось некоторое время, чтобы разобраться с ней.

Первоначально опубликовано на https://engineering.wootric.com 24 ноября 2020 г.