Pavel Pikat

Deepcopy с Object.assign сделать невозможно. Object.assign создает shallow copy. Вложенные объекты являются ссылками на оригинальный объект.

Чтобы сделать deepcopy, нужно использовать другие инструменты.
Например, JSON.parse(JSON.stringify(object)) (с потерей данных)
или использовать стороннюю библиотеку в которой это реализовано, типа jQuery/lodash

Для Ангуляра обычно используют TSLint - аналог ESLint, только для TypeScript'a. И, соответсвенно, правила TSLint'a настраиваются для Англуляр проектов в файле tslint.json, или используют сразу готовый набор правил, например https://www.npmjs.com/package/angular-tslint-rules.

Лично я, например, Prettier совсем не пользуюсь

Я бы писал все на знакомом Front-end стэке, ну например React + Canvas как вы написали, и рендерил это в бэке посредством Headless Chrome + Puppeteer, с конвертацией в PDF/PNG/JPG

Нет ничего плохого в том, что писать код по-простому и, как говорится, verbose. Это делает его более потнятным и читабельным. С другой стороны, у вас проблемы с читабельностью из-за недостающих пробелов, использования одинарных и двойных кавычек одновременно, == вместо === и т.д. Советую поставить плагин а-ля JSLint/TSLint который бы подсвечивал все косяки в соответсвии с общепринятыми нормами. Так вы научитесь писать более чистый код.

По структуре я бы отметил чрезмерное использование else/if. Посмотрите где можно заменить на switch. Также, конструкцию

speechSynthesis.speak(new SpeechSynthesisUtterance(fform + "покрашен на зелёный цвет"));

можно вынести в отдельную функцию

function speak(message) {
speechSynthesis.speak(new SpeechSynthesisUtterance(speak));
}

и вызывать speak(fform + "покрашен на зелёный цвет");