A JavaScript bundle optimizer.
Go to file
Dominic Gannaway f3355c91ca Fold simple class components
Summary:
Release note: Adds support for folding simple React class components

This PR adds the concept of "simple" class components. A "simple" class component is defined as:
- having only a "render" method or many method, i.e. `render()`, `_renderHeader()`, `_renderFooter()`
- having no lifecycle events
- having no state
- having no instance variables

The only things a class component should be able to access on "this" are:
- `this.props`
- `this.context`
- `this._someRenderMethodX()` etc

It does this by first attempting to evaluate any class component with the heuristics as if it were a simple class component. If that throws an error (entirely expected for most class components), it catches the error and falls back to trying to use the "complex" class component route for evaluation instead.

Furthermore, I've added "transforms". This allows post-transforms of the serialized AST for additional functions. The simple class component adds a transform to convert AST nodes of `this.props` to `props` and `this.context` to `context` respectfully – whilst adding arguments to the function; something that is necessary to convert simple class component render methods to functional components.

This PR also adds logic to squash simple class components into functional components at the root (as simple class components are easily convertible to functional components).
Closes https://github.com/facebook/prepack/pull/1204

Differential Revision: D6485508

Pulled By: trueadm

fbshipit-source-id: 06ebeebad5d23c0677a0e3f0cb8dd23c45735429
2017-12-05 08:24:12 -08:00
bin Switch to a proper command invocation for hermes 2017-12-04 11:57:46 -08:00
flow-libs Set up adapter communication channel with Prepack 2017-10-27 12:54:08 -07:00
flow-typed/npm Avoid duplicate nested function body(Part1) 2017-10-17 10:46:10 -07:00
scripts Fold simple class components 2017-12-05 08:24:12 -08:00
src Fold simple class components 2017-12-05 08:24:12 -08:00
test Fold simple class components 2017-12-05 08:24:12 -08:00
.babelrc Use preset-env (#512) 2017-05-23 17:30:54 -04:00
.eslintignore Enable eslint prettier plugin 2017-07-18 14:09:05 -07:00
.eslintrc Enable eslint prettier plugin 2017-07-18 14:09:05 -07:00
.flowconfig Set up flow-libs 2017-10-19 17:12:49 -07:00
.gitignore Simplify path conditions 2017-09-20 15:18:49 -07:00
.gitmodules Initial commit 2017-03-28 20:52:41 -07:00
.watchmanconfig Add React functional component folding 2017-11-06 05:07:36 -08:00
circle.yml Update expected number of test262 passes 2017-12-04 16:12:01 -08:00
CODE_OF_CONDUCT.md Add COC to Prepack 2017-11-20 21:33:13 -08:00
CONTRIBUTING.md Add COC to Prepack 2017-11-20 21:33:13 -08:00
LICENSE Initial commit 2017-03-28 20:52:41 -07:00
package.json Update release version to v0.2.15-alpha.0 2017-12-04 17:09:05 -08:00
PATENTS Initial commit 2017-03-28 20:52:41 -07:00
README.md Change some http links to https 2017-09-30 14:08:44 -07:00
webpack.config.js Refactor the public API in a similar style to Babel API (#469) 2017-04-27 00:30:00 -07:00
yarn.lock Use integration api to run Test262 tests 2017-12-01 17:46:29 -08: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

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
    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 gh-pages branch 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, run python -m SimpleHTTPServer (Python 2) or python -m http.server (Python 3) from the cloned gh-pages branch.

At this time, a particular bundled version of Prepack is checked in to the gh-pages branch at js/prepack.min.js. To update the bundle, run yarn build-bundle from the master branch, and copy the resulting prepack.min.js file into the gh-pages branch into the js directory, and submit a pull request for that change.

How to contribute

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.