[bug] Bud dev slows down and public keeps growing with hot-update files

[maxswinkels]

Agreement

• This is not a duplicate of an existing issue
• I have read the guidelines for Contributing to Roots Projects
• This is not a personal support request that should be posted on the Roots Discourse community

Describe the issue

I have encountered a persistent issue during my development workflow using yarn bud dev. The problem revolves around the continuous growth of the public folder with hot-update files, leading to increased disk usage and potential performance degradation. Additionally, with each code change particularly when adding Tailwind CSS classes, the browser becomes noticeably slower, but opening the URL in a new tab temporarily resolves the issue. It appears that there may be some form of memory accumulation or resource leakage during the hot-reloading process.

Expected Behavior

1. The public folder should not accumulate excessive hot-update files during development.
2. The browser should not experience performance degradation with each update during hot-reloading.

Actual Behavior

Continuous growth of the public folder with hot-update files, leading to increased disk usage and potential performance degradation

Steps To Reproduce

1. Run yarn bud dev in your development environment.
2. Observe the continuous growth of hot-update files in the public folder.
3. Notice the browser becoming slower after each update, but resolving the issue temporarily by opening the URL in a new tab.

version

6.15.1

Logs

No response

Configuration

Here is the relevant configuration from my package.json file:

"devDependencies": {
  "@roots/bud": "6.15.1",
  "@roots/bud-eslint": "6.15.1",
  "@roots/bud-prettier": "6.15.1",
  "@roots/bud-sass": "6.15.1",
  "@roots/bud-stylelint": "6.15.1",
  "@roots/bud-tailwindcss": "6.15.1",
  "@roots/eslint-config": "6.15.1",
  "@roots/sage": "6.15.1",
  "stylelint-config-property-sort-order-smacss": "^9.1.0"
}

And here is an excerpt from my Bud configuration file (bud.config.js):

export default async (app) => {
  app
    .entry({
      app: ['@scripts/app', '@styles/app'],
    })
    .assets(['images'])
    .watch(['resources/views', 'app'])
    .proxy('http://projectname.local')
    .serve('http://localhost:3000')
    .setPublicPath('/wp-content/themes/projectname/public/');

  app
    .extensions
    .get('@roots/bud-stylelint')
    .setOption('fix', true);
};

### Relevant .budfiles

_No response_

[maxswinkels]

Addition to the number of files already accumulating in the public folder after just modifying the body styling

[kellymears]

The number of files is not a performance bottleneck and not a concern.

It is possible there is a memory leak somewhere. If so, the problem would be in @roots/bud-client, as opening a new tab is resetting the client connection but not the server/middleware.

What type of sourcemap are you using?

[kellymears]

Just as an example of the behavior I observe and expect in a healthy app:

These changes were all made to css source files. You can see the time to render in the browser is variable but all more or less instantaneous. It doesn't seem to go up as additional changes accumulate.

And yes, the dist directory is absolutely packed with module updates:

I think what might be most helpful at this point is if you can reproduce your problem in a github repository or a codesandbox instance. I'm beginning to suspect that what you're experiencing might have more to do with your app code than the @roots/bud-client library.

[github-actions]

Message to comment on stale issues. If none provided, will not mark issues stale