A web project can be considered divided into two large parts, the backend and the frontend. Since they are separated processes they can be developed in parallel. AEM has included a mechanism to generate a webpack-based frontend development module called ui.frontend in its archetype.
Inside the ui.frontend module, frontend developers can develop their CSS and JS functionalities by creating a local development environment separated from the AEM instance. Once the logic and design are finished, they can export the output of this minified and compiled code (in the case TS or a CSS preprocessors have being used) by webpack to the target clientlib thanks to the aem-clienlib-generator plugin.
Regarding CSS, webpack provides full Sass / Scss compatibility due to the CSS compilation through the webpack.
Nonetheless, using the ui.frontend comes with different disadvantages. For instance, when managing the HTML, there is no way to use sightly in this part of the project, therefore the HTML will only be suitable for the design part.
Moreover, advanced interfaces can be implemented on this data, defining the structure and type of the object that will work with later and being helped by the development IDEs to autocomplete the code.
In conclusion, thanks to typescript, the developer can convert the JS into a more mature language. In addition to this, it is 100% compatible with the previous JS, therefore it can be incorporated at any stage of the project.