Roundtable for JS Engineers: Insight into Optimization, Structure, and Architecture

Roundtable JavaScript JS Engineers

The first Roundtable for Javascript Engineers gathered 7 engineers at HTEC Nis offices to discuss the web app optimization along with application structure and architecture. HTEC’s web engineer Aleksandar Benic took the role of the moderator.

The first (of two) 45-minute session dealt with app optimization, focusing on code splitting as one of the means to speed up web apps. The idea of code splitting is to send to the browser only those parts of the code that are needed to load the UI part the user is focused on. Developers need to be careful with the size of the libraries they are using and need to include some of the performance budget tools to prevent the deployment of js files that are larger than the targeted value. Currently, developers are struggling with monolithic libraries, such as MomentJS, which have to be fully included, unlike RxJS which allows including just the needed parts.

The conclusion was to be careful with what is imported and to import only when necessary. Potentially, one of the solutions would be to use web workers and move the logic inside them while the rendering is kept in the main thread, but this is still experimental. Optimization of assets was also discussed and it was agreed that the best to use were the SVG image format, the CDN, next-gen image formats, pushing with https 2, gzip resources, etc.

After a small break, the discussion moved onto Architecture and Structure. Because of the breadth of the topic, the idea was to discuss these two aspects on the level of a specific problem rather than abstractly. The participants focused on conceptualizing the structure of the imaginary web shop application. Some of the conclusions were to respect the conventions of the tools used and follow good practices from the respective communities. The participants also talked about the observables that can help solve the asynchronicity of the apps, as one of the possible patterns to use. The topics of the component-based approach, the folder structure, the atomic design and similar tips for JavaScript engineers were also addressed.

Based on the participants’ reactions and the level of involvement in the discussions, the roundtable proved to be an excellent format with the engineers debating and sharing their experiences rather than just offering one-directional presentations on their personal achievements.

Related Posts