As regular readers of my blog may know, our primary technology stack is the MERN stack MongoDB, Express, React, and Node.js. On the frontend, we use React with TypeScript; on the backend, Node.js with TypeScript, and MongoDB serves as our database.
While this stack has served us well, we encountered significant challenges as our application scaled—particularly around build times, memory usage, and developer experience. In this post, I will outline two key areas where Rust-based tools helped us resolve these issues and substantially improved our team’s development velocity.
Improving Frontend Performance
The Problem: Slow Builds and Poor Developer Experience
As our frontend codebase grew, we began facing several recurring issues:
- Local development startup times became painfully slow.
- Build processes consumed large amounts of memory.
- On lower-end machines, builds caused systems to hang or crash.
- Developers regularly raised concerns about delays and performance bottlenecks.
These issues were primarily due to our use of Create React App (CRA) with an ejected Webpack configuration. While powerful, this setup became increasingly inefficient for our scale and complexity.
First Attempt: Migrating to Vite
In search of a solution, I explored Vite, a build tool known for its speed and modern architecture.
Benefits:
- Faster initial load times due to native ES module imports.
- Noticeable improvement in development server startup.
Challenges:
- Migrating from an ejected CRA setup was complex due to custom Webpack configurations.
- Issues arose with lazy-loaded routes, SVG assets, and ESLint/type-checking delays.
- Certain runtime errors occurred during navigation, likely due to missing or incorrect Vite configurations.
Ultimately, while Vite offered some performance benefits, it did not fully resolve our problems and introduced new complications.
Final Solution: Adopting Rspack
After further research, we came across Rspack, a high-performance Webpack-compatible bundler written in Rust. What caught my attention was its focus on performance and ease of migration.
Key advantages of Rspack:
- Significantly faster build times up to 70% improvement in our case.
- Reduced memory consumption during both build and development.
- Compatibility with existing Webpack plugins and configurations, which simplified migration.
- Designed as a drop-in replacement for Webpack.
After resolving a few initial issues, we successfully integrated Rspack into our frontend build system. The migration resulted in substantial improvements in build speed and developer satisfaction. The system is now in production with no reported issues, and developers are once again comfortable working on the frontend.
Accelerating Backend Testing
The Problem: Slow Kubernetes-Based Testing Cycle
Our backend uses Kubernetes for deployment and testing. The typical development workflow looked like this:
- A developer makes code changes.
- A Docker image is built and pushed to a registry using github action.
- The updated image is deployed to the Kubernetes cluster.
- Testers verify the changes.
This process, while standard, became inefficient. Even small changes (such as adding a log statement) required a full image build and redeployment, resulting in delays of 15 minutes or more per test cycle.
Optimization: Runtime Code Sync
To address this, we have written the shell script that will first run when the pod starts or restart which will pull the latest changes from github and run the code.
git reset --hard origin/$BRANCH_NAME
git pull origin $BRANCH_NAMEThis significantly reduced testing turnaround time for JavaScript-based services.
The TypeScript Bottleneck
However, for services written in TypeScript, the situation was more complex. After pulling the latest code, we needed to transpile TypeScript to JavaScript using tsc or npm run build. Unfortunately, this process:
- Consumed excessive memory.
- Took too long to complete.
- Caused pods to crash, especially in test environments with limited resources.
Solution: Integrating SWC
To solve this, we adopted SWC, a Rust-based TypeScript compiler. Unlike tsc, SWC focuses on speed and performance.
Results after integrating SWC:
- Compilation time reduced to approximately 250 milliseconds.
- Memory usage dropped significantly.
- Allowed us to support live code updates without full builds or redeployments.
Because SWC does not perform type checking, we use it only in test environments. This tradeoff allows testers to verify code changes rapidly, without impacting our production pipeline.
Conclusion: Rust’s Impact on Team Efficiency
In both our frontend and backend workflows, Rust-based tools Rspack and SWCdelivered substantial improvements:
- Frontend build times were reduced by more than 70%, with better memory efficiency.
- Testing cycles became significantly faster, especially for TypeScript services.
- Developer experience improved across the board, reducing frustration and increasing velocity.
Rust’s performance characteristics, coupled with thoughtful tool design, played a critical role in resolving bottlenecks in our JavaScript-based systems. For teams facing similar challenges, especially around build performance and scalability, we strongly recommend exploring Rust-powered tools as a viable solution.
As you are the regular reader of my blog you might guessed the stack that i am working if not it is MERN stack where we user React for frontend for backend we use typescript, node and mongodb for database . So the tech stack may look cool but we face few issue when scaling and how Rust help us to solve that problem is we going to see
How running and deploying frontend became Mess
When the project or product grows we get some painfull issues like running code in local and building the code take so much time because we have react with typescript, eslint and other webpack plugin needed for our use case if you already worked with webpack you might know that webpack is slow for large projects we getting lot compience by developer daily that when i run client in local it getting to much and time and consume more space and for low end laptop the laptop even got hanged so our developers are crying when the get frontend task .
To solve this problem i just jump in to and did some R&D and has vite is popular next to the webpack. so i thought of implementing the vite to our codebase it not easy as we think because we using CRA ejected webpack config which we have lot custom config we have so it not worked as except but after lot of stuggle finally i have setup the vite and able to run our codebase without any errros and it was some what fast compared to webpack because they use native import feature it fast when we running but we have lot lazy load page on page navigate i am clearly able to see the difference there is some taking and also i have the typecheck and eslint check take some time so we have not fully solved the problem and we have some svg breaking and some lazy load breaks due to the imporper confing in vite
Then i started the R&D again and find out the builder RSPACK i really love there icon and home page where they have listed rspack is fasted among webapack , vite , etc they have promised it only took 410ms it caught my attention and i started reading there blog and dev doc where they have told they build this to easy replacement of webapack so anyone can easily migrate with same synatax and config and other plugin that webpack support so it not hard compared to vite to setup and note rspack is wiritten in RUST to improve the speed and efficency
After few of issue and troubles (if you interesend how to migrate from webapck to rspack you comment i will write a seprate blog for it) i have setup the rspack succesfully to our repo and it was 70% better then webapck and it take very less memory compared webapcack finally i have won
After all testing done with rspack migration we have successfully rolled out the production with no issue and now all developers are just happy to work with frontend
So the thing we need to thank you RUST for building effieceitn programming language and rspack commuity
How Rust help in our backend to seepup the testing
This is our backend story where we using kubernetes for our deployment and testing purpose so how our testing workflow ususally will be like where developer did the code changed and build the docker image and upload then we update in kuberntes which will refelct the new code and tester will test but the issue was let say if the developer need to add any console or did the code change that tester need to test we need to wait for more then 15 to build the docker image and push etc
so to solve this we came up with idea of so basically in the docker image we only chaning the code nothing else so why can’t we write a shell scirpt that will pull the latest changes before running the code in docker such that if we restart the server it will pull the changes from github for that branch and run ther server
This works fine when we have js but few repos we have typescript so we need to pull and convert the ts to js to make sure to code refelect but the issue we face when we give npm run build after pull we see the pod get crashed because less memory because in test server we usually give less memory but npm run build comsume more space and taking so much time which cause our solutoon to not works for ts repo
To solve this i have did some Rearsech and i findout SWC the again a Rust compiler for typesript conversion i have tested it and it was so amazing only took 250ms and less memory.but the issue is i dont check any typeerrors so we have added this only for our test enviroument
SO based on our 2 story RUSt paly a vital role in impoving our team velocity