gajus / gajus/prepack-webpack-plugin

Webpack + Prepack + React, not optimizing react elements

Open
#53 1 comment 0 reactions 0 assignees View on GitHub
question
Dominant language
JavaScript
Stars
1k
Forks
31
PR merge metrics
No merged PRs in 30d

Description

## Expected Behavior

Attempting to get this to prepack react elements: https://github.com/facebook/prepack/wiki/react-compiler

## Actual Behavior

Components don't seem to be picked up, neither do `__evaluatePureFunction` tagged functions. I do see prepack working on other areas.

## Specifications

- Platform: Mac
- Plugin version: 1.1.2
- Webpack version: 4.25.1

Here's some example code output when running it:

```

const CosalDebug = __evaluatePureFunction(() => {
return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
style: {
height: '100%',
overflow: 'hidden',
position: 'relative'
}
}, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](Half, null, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_Saliency__WEBPACK_IMPORTED_MODULE_2__[
/* Saliency */
"a"], null)), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](Half, {
style: {
flex: 4
}
}, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_Search__WEBPACK_IMPORTED_MODULE_1__[
/* Search */
"a"], null)));
}); // prepack

if (global.__optimizeReactComponentTree) {
__optimizeReactComponentTree(CosalDebug);
}
```

As you can see the function doesn't seem to be touched by prepack, but I'm attempting to run it with these options:

```
new PrepackPlugin({
reactEnabled: true,
compatibility: 'node-react',
})
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the PrepackPlugin configuration using reactEnabled and compatibility: 'node-react', then reproduce the issue with the Webpack 4.25.1 output shown in the report. Trace why the generated React component and __evaluatePureFunction call are not processed; done means the relevant React elements and tagged function are optimized as expected.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, webpack
Domain
build-system
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.