Flexmonster production build is slower than development build

Hello, Dan,
 
Thank you for reaching out to us.
 
We want to ask for some additional details about your case to try reproducing it on our side.

1. What plugin is used to perform development and production builds in the project.
2. Please send us the plugin configurations both for development and production builds.
3. It would also be helpful to see the full script dedicated to starting builds in the project.
4. Please provide us with additional information about “less readable” method names in the development build and how it differs from the names in the production build. We assume the difference in performance may be caused by the extra obfuscation of the minimized JS file containing Flexmonster. Therefore, it would be useful for us to have detailed information on this point.

 
Our team is looking forward to hearing from you.
 
Kind regards,
Illia

Hello,
 
Thank you for providing the details.
 
We may need some time to reproduce the issue and investigate possible causes.
Our team will reach out to you as soon as possible.
 
Feel free to contact us in case any additional questions arise.
 
Best regards,
Illia

Hello, Dan,
 
Thank you for giving us some time.
 
We did manage to reproduce this behavior using our react sample. Also, we noticed both CSV and JSON analysis takes more time on the production build.
Our team will research this issue and provide you with results ETA May 05.
 
Please let us know if it works for you.
 
Best regards,
Illia

Hello, Dan,
 
We are happy to let you know that we did manage to investigate the issue earlier.
 
The problem seems to be caused by the babel-loader tool used while building React apps with Webpack.
The solution is to exclude Flexmonster from files requiring transpilation.
First, you will need to expose Webpack and babel-loader configuration by running the npm run eject command.
Next, exclude Flexmonster from the babel-loader configuration in the `webpack.config.js` file:

// Process any JS outside of the app with Babel.
// Unlike the application JS, we only compile the standard ES features.
{
  test: /\.(js|mjs)$/,
  exclude: [
    /node_modules[\\/]flexmonster/,
    /@babel(?:\/|\\{1,2})runtime/
  ],
loader: require.resolve('babel-loader'),
...

 
Please let us know if it works for you.
 
Best regards,
Illia

Hello, Dan,
 
Thank you for your feedback.
 
We want to confirm that after ejecting and configuring excluded file the project can be launched using the “npm run build” command.
 
Concerning the possibility of ejecting and building the component afterward with the aim to preserve the project unejected.
We are not ready to provide you with a determined answer on this point. Our concern is the fact that the project may remain ejected after the build.
Still, we suggest creating an additional branch and testing this approach. In case of failure, you will be able to come back to the unejected version.
 
Also, we want to note that ejecting should not affect any other aspects of the application. It is a common practice that allows customizing the build configuration.
 
Please let us know if it helps.
 
Kind regards,
Illia

Hello, Dan,
 
We are wondering if the proposed solution works for you.
 
Looking forward to hearing your feedback.

Regards,
Illia

Hello, Dan,
 
Thank you for your question.
 
Please note that the discussed issue is caused by the way React build is performed. In its turn, Flexmonster will continue to be delivered as a minified file that should not be transpiled by other tools.
 
Therefore, we suggest either use the current build approach or fully ejecting the project to change the Babel configuration.
 
We hope it helps.
Feel free to reach out if other questions arise.
 
Best regards,
Illia