skip to Main Content

so I understand that the browser can only read plain javascript code, so all my react+typescript projects need to be converted to plain js before they run. this is done during the build process, the build process is usually done when deploying the app.

if that’s the case how does local development work? is my app being built every time I make a change? and if we’re capable of actually building the app every time a change is made in a matter of seconds why does the actual building of the app take up to a minute sometimes?

I tried researching this topic, but couldn’t come to a clear conclusion that I understand

3

Answers


  1. When we make changes it won’t build the complete app again. It just build changes what we made and then inject them into the browser

    you can refer to how hot reloading works in reactjs

    Login or Signup to reply.
  2. When you run a local development server and build the process it transpiles your code.

    Transpiling is the process of taking source code written in one
    language and transforming it into another language that has a similar
    level of abstraction.

    The transpiled code is bundled and served to your browser.

    For more: https://blog.logrocket.com/how-browser-rendering-works-behind-scenes/

    Login or Signup to reply.
  3. Starting from 4.x, Create React App(and Vite, maybe even others) enables React Fast Refresh (previously it was called react-hot-loader) by default, you can read about it here.
    Basically, it refreshes/re-mounts only the component that has changes made to its code and it does so without losing its state. So, judging if you disabled it or maybe not even included your react app might rebuild and reload the whole app.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search