A JavaScript bundle optimizer.
Go to file
Caleb Meredith 88d9495226 Add abstract serializer mode for test262 execution (#2297)
Summary:
I extended the `--serializer` command line argument I added in #2290 to now support `--serializer abstract-scalar`. What this mode does is it converts all boolean, string, number, and symbol literals into abstract values. I did not choose to extend this logic to object and array literals just yet since scalars alone showed some interesting results.

What I really want here is a review of the results.

Full suite execution results are real bad. **18%** pass rate. I dug a bit into why.

```
=== RESULTS ===
Passes: 3356 / 17780 (18%)
ES5 passes: 2276 / 12045 (18%)
ES6 passes: 1080 / 5735 (18%)
Skipped: 13375
Timeouts: 28
```

I was mostly interested in the runtime failures we see since that means Prepack is serializing invalid code. However, I found ~14k failures in the Prepack stage (more on this in a bit) and ~3k failures in the runtime stage. This means ~80% of tests _fail to compile_ with this abstract transformation applied.

Why are these tests failing? I took the first 4 items of the stack traces from errors thrown in the Prepack stage, sorted, and ranked them. [Here’s the result.](https://gist.github.com/calebmer/29e27613325fd99fa04be7ab4a9641c0) The top 5 with thousands of hits are:

```
7538 of:
    at AbstractValue.throwIfNotConcrete (/Users/calebmer/prepack/src/values/AbstractValue.js:536:11)
    at ToImplementation.ToStringPartial (/Users/calebmer/prepack/src/methods/to.js:717:69)
    at NativeFunctionValue._index.NativeFunctionValue [as callback] (/Users/calebmer/prepack/src/intrinsics/ecma262/String.js:34:37)
    at NativeFunctionValue.callCallback (/Users/calebmer/prepack/src/values/NativeFunctionValue.js:121:12)

4595 of:
    at AbstractValue.throwIfNotConcrete (/Users/calebmer/prepack/src/values/AbstractValue.js:536:11)
    at NativeFunctionValue.func.defineNativeMethod [as callback] (/Users/calebmer/prepack/src/intrinsics/ecma262/Object.js:328:41)
    at NativeFunctionValue.callCallback (/Users/calebmer/prepack/src/values/NativeFunctionValue.js:121:12)
    at functionCall (/Users/calebmer/prepack/src/methods/call.js:308:26)

1454 of:
    at AbstractValue.throwIfNotConcrete (/Users/calebmer/prepack/src/values/AbstractValue.js:536:11)
    at NativeFunctionValue.func.defineNativeMethod [as callback] (/Users/calebmer/prepack/src/intrinsics/ecma262/Object.js:364:41)
    at NativeFunctionValue.callCallback (/Users/calebmer/prepack/src/values/NativeFunctionValue.js:121:12)
    at functionCall (/Users/calebmer/prepack/src/methods/call.js:308:26)

1351 of:
    at invariant (/Users/calebmer/prepack/src/invariant.js:18:15)
    at EvalPropertyNamePartial (/Users/calebmer/prepack/src/evaluators/ObjectExpression.js:59:7)
    at _default (/Users/calebmer/prepack/src/evaluators/ObjectExpression.js:80:21)
    at LexicalEnvironment.evaluateAbstract (/Users/calebmer/prepack/src/environment.js:1368:20)

1053 of:
    at AbstractValue.throwIfNotConcrete (/Users/calebmer/prepack/src/values/AbstractValue.js:536:11)
    at NativeFunctionValue.obj.defineNativeMethod [as callback] (/Users/calebmer/prepack/src/intrinsics/ecma262/ObjectPrototype.js:35:39)
    at NativeFunctionValue.callCallback (/Users/calebmer/prepack/src/values/NativeFunctionValue.js:121:12)
    at functionCall (/Users/calebmer/prepack/src/methods/call.js:308:26)
```

This means there may be some low hanging fruit.

Here are my questions for you.

- Did you expect results like this?
- What is our ideal test262 pass rate with this transformation applied?
- What happens to React Compiler or other projects when these errors are thrown? (As I understand it, we bail out and don’t optimize the code, but do optimize the code around it.)
- Do you think my methodology is flawed?

It’s also possible that something in my methodology is wrong, but I didn’t spend much time investigating these failures as I spent investigating the failures I found in #2290.

My goal with this test suite is to build an understanding of what “correctness” for the React Compiler against all JavaScript code looks like. (Not just the few bundles we’ve selected to look at.) I don’t think these results suggest that we only safely compile 18% of the language, but it’s a data point. I’ll be looking into fixing a selection of these issues to better understand their nature or if I need to change methodologies.
Pull Request resolved: https://github.com/facebook/prepack/pull/2297

Differential Revision: D9120572

Pulled By: calebmer

fbshipit-source-id: b394f1e8da034c9985366010e3e63fd55fd94168
2018-08-01 10:38:42 -07:00
.circleci Use Flow server for local development (#2245) 2018-07-18 06:40:25 -07:00
assets Adding raw Prepack Logo assets (#2189) 2018-07-03 12:45:47 -07:00
bin Cleanup files 2017-12-12 11:12:24 -08:00
fb-www Make React tests fast (#2187) 2018-07-02 11:25:58 -07:00
flow-libs Set up adapter communication channel with Prepack 2017-10-27 12:54:08 -07:00
flow-typed/npm Upgrade Prepack to Babel 7 (#2256) 2018-07-14 09:55:18 -07:00
scripts Add abstract serializer mode for test262 execution (#2297) 2018-08-01 10:38:42 -07:00
src Add abstract serializer mode for test262 execution (#2297) 2018-08-01 10:38:42 -07:00
test Adds generic unknown array method nested optimized function support (#2346) 2018-07-31 16:29:21 -07:00
website Delete node-cli Option and all the Node.js intrinsics (#2267) 2018-07-16 13:09:59 -07:00
.eslintignore Upgrade Prepack to Babel 7 (#2256) 2018-07-14 09:55:18 -07:00
.eslintrc Prettier 1.13.4 fixes 2018-06-06 12:49:59 -07:00
.flowconfig Use Flow server for local development (#2245) 2018-07-18 06:40:25 -07:00
.gitignore Optimize ReactEquivalenceSet (#2243) 2018-07-13 13:40:00 -07:00
.gitmodules Initial commit 2017-03-28 20:52:41 -07:00
.prettierrc Run Prettier checks on CI (#2212) 2018-07-10 09:55:23 -07:00
.watchmanconfig Add React functional component folding 2017-11-06 05:07:36 -08:00
babel.config.js Add serializer mode for test262 execution (#2290) 2018-07-18 18:54:51 -07:00
CODE_OF_CONDUCT.md Updated the code of conduct links. (#2284) 2018-07-18 10:39:53 -07:00
CONTRIBUTING.md Updated the code of conduct links. (#2284) 2018-07-18 10:39:53 -07:00
LICENSE Initial commit 2017-03-28 20:52:41 -07:00
package.json New alpha version for Prepack 2018-07-31 19:08:50 -07:00
PATENTS Initial commit 2017-03-28 20:52:41 -07:00
README.md Adding raw Prepack Logo assets (#2189) 2018-07-03 12:45:47 -07:00
webpack.config.js Upgrade Prepack to Babel 7 (#2256) 2018-07-14 09:55:18 -07:00
yarn.lock Repro option creates package with sourcefiles, debugger startup script (#2289) 2018-07-26 14:55:16 -07:00

Prepack Circle CI

Prepack is a partial evaluator for JavaScript. Prepack rewrites a JavaScript bundle, resulting in JavaScript code that executes more efficiently. For initialization-heavy code, Prepack works best in an environment where JavaScript parsing is effectively cached.

See the official prepack.io website for an introduction and an interactive REPL playground.

How to use Prepack

Install the CLI via npm,

$ npm install -g prepack

Or if you prefer yarn, make sure you get yarn first,

$ npm install -g yarn

and then install the Prepack CLI via yarn:

$ yarn global add prepack

You may need to prepend (pun intended!) the command with sudo in some cases.

Let the party begin

To compile a file and print the output to the console:

$ prepack script.js

If you want to compile a file and output to another file:

$ prepack script.js --out script-processed.js

Detailed instructions and the API can be found at Prepack CLI: Getting Started

Plugins to other tools

The following are a few plugins to other tools. They have been created and are maintained separately from Prepack itself. If you run into any issues with those plugins, please ask the plugin maintainers for support.

Status

How to get the code

  1. Clone repository and make it your current directory.
  2. git submodule init
  3. git submodule update --init
  4. Get yarn and node, then do yarn

Note: For development work you really need yarn, as many scripts require it.

How to build, lint, type check

  1. Get the code
  2. yarn build
    You can later run yarn watch in the background to just compile changed files on the fly.
  3. yarn lint
  4. yarn flow

How to run tests

  1. Get the code
  2. Make sure the code is built, either by running yarn build or yarn watch
  3. yarn test

You can run individual test suites as follows:

  • yarn test-serializer
    This tests the interpreter and serializer. All tests should pass.
  • yarn test-test262
    This tests conformance against the test262 suite. Not all will pass, increasing conformance is work in progress.

How to run the interpreter

  1. Get the code
  2. Make sure the code is built, either by running yarn build or yarn watch
  3. yarn repl
    This starts an interactive interpreter session.

How to run Prepack

  1. Get the code

  2. Make sure the code is built, either by running yarn build or yarn watch.

  3. Have a JavaScript file handy that you want to prepack, for example:
    echo "function hello() { return 'hello'; } function world() { return 'world'; } s = hello() + ' ' + world();" >/tmp/sample.js

  4. cat /tmp/sample.js | yarn prepack-cli
    Try --help for more options.

How to validate changes

Instead of building, linting, type checking, testing separately, the following does everything together:
yarn validate

How to edit the website

The content for prepack.io resides in the website directory of this repository. To make changes, submit a pull request, just like for any code changes.

In order to run the website locally at localhost:8000:

  1. Build prepack into the website: yarn build && mv prepack.min.js website/js
  2. Run python -m SimpleHTTPServer (Python 2) or python -m http.server (Python 3) from the website/ directory

How to contribute

To read more about the project, check out this suggested reading wiki

For more information about contributing pull requests and issues, see our Contribution Guidelines.

License

Prepack is BSD-licensed. We also provide an additional patent grant.