After researching the benefits of leveraging a CDN to improve web application speed, I am looking for advice on how to implement this strategy in my React application that uses Stylus for CSS. Currently, each component or page has its own separate local Stylus file to maintain isolated styles. However, most of these files contain around 1000 lines of common code, which is slowing down the loading speed of my application. My idea is to move the CSS to a CDN to enhance performance. How can I integrate this into my existing project structure?
At the moment, I include Stylus in each component like this:
import c from "./reviews.styl"
render() {
return (
<div className={c.container}>
If I create a separate CSS file as suggested to consolidate all common styles, how do I instruct each component to utilize that common.css file? Each component already imports its respective Stylus file as shown above.