8000 feat: various export optimizations · gregberge/recompact@4b52383 · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content
This repository was archived by the owner on Nov 26, 2018. It is now read-only.

Commit 4b52383

Browse files
gregbergegregberge
committed
feat: various export optimizations
- Officially support babel-plugin-lodash and document it - Exports recompact in umd format - Document tree shaking - Refactor build process BREAKING CHANGES: - Use loose mode in babel
1 parent aab5fc7 commit 4b52383

16 files changed

+190
-323
lines changed

‎.babelrc

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,12 @@
11
{
2-
"presets": ["latest", "react", "stage-0"]
2+
"plugins": [
3+
["transform-class-properties", { "loose": true }],
4+
"transform-object-rest-spread"
5+
],
6+
"presets": [
7+
["latest", {
8+
"es2015": { "loose": true }
9+
}],
10+
"react"
11+
],
312
}

‎.eslintignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
node_modules/
22
lib/
33
coverage/
4+
examples/dist/

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
node_modules/
22
lib/
33
coverage/
4+
examples/dist/

‎README.md

Lines changed: 40 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,55 @@ To install the stable version:
1313
yarn add recompact
1414
```
1515

16-
To import the entire core set of functionality:
16+
and to use it in your code:
1717

1818
```js
1919
import recompact from 'recompact'
2020
```
2121

22-
To import only what you need (this is useful for size-sensitive bundling):
22+
## Optimizing bundle size
2323

24+
### [babel-plugin-lodash](https://github.com/lodash/babel-plugin-lodash)
25+
26+
The best way to reduce build size is to use [babel-plugin-lodash](https://github.com/lodash/babel-plugin-lodash):
27+
28+
**.babelrc**
29+
30+
```json
31+
{
32+
"plugins": [
33+
["lodash", { "id": "recompact" }],
34+
]
35+
}
36+
```
37+
38+
Transforms
39+
```js
40+
import recompact from 'recompact'
41+
import { pure, withProps } from 'recompact/withProps'
42+
43+
const enhance = recompact.compose(
44+
withProps({ className: 'beautiful' }),
45+
pure,
46+
)
47+
```
48+
49+
roughly to
2450
```js
25-
import mapProps from 'recompact/mapProps'
51+
import _compose from 'recompact/compose'
52+
import _pure from 'recompact/pure'
53+
import _withProps from 'recompact/withProps'
54+
55+
const enhance = _compose(
56+
_withProps({ className: 'beautiful' }),
57+
_pure,
58+
)
2659
```
2760

61+
### Tree shaking
62+
63+
Since [tree shaking isn't ready yet to reduce build size efficiently](https://advancedweb.hu/2017/02/07/treeshaking/), it is not supported in recompact.
64+
2865
## [Documentation](https://github.com/neoziro/recompact/tree/master/docs)
2966

3067
## [Benchmarks](https://github.com/neoziro/recompact/tree/master/src/__benchmarks__)

‎examples/RecompactCounter.js

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
11
import React from 'react'
2-
import setDisplayName from '../src/setDisplayName'
3-
import compose from '../src/compose'
4-
import pure from '../src/pure'
5-
import withState from '../src/withState'
6-
import renameProp from '../src/renameProp'
7-
import withHandlers from '../src/withHandlers'
2+
import { setDisplayName, compose, pure, withState, renameProp, withHandlers } from '../src'
83

94
export default compose(
105
setDisplayName('RecompactCounter'),

‎examples/RecomposeCounter.js

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
11
import React from 'react'
2-
import setDisplayName from 'recompose/setDisplayName'
3-
import compose from 'recompose/compose'
4-
import pure from 'recompose/pure'
5-
import withState from 'recompose/withState'
6-
import renameProp from 'recompose/renameProp'
7-
import withHandlers from 'recompose/withHandlers'
2+
import { setDisplayName, compose, pure, withState, renameProp, withHandlers } from 'recompose'
83

94
export default compose(
105
setDisplayName('RecomposeCounter'),

‎examples/webpack.config.babel.js

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import path from 'path'
2+
import HtmlWebpackPlugin from 'html-webpack-plugin'
3+
4+
export default {
5+
entry: path.resolve('./examples/main.js'),
6+
output: {
7+
path: path.resolve('./examples/dist'),
8+
filename: 'main.js',
9+
},
10+
plugins: [new HtmlWebpackPlugin()],
11+
module: {
12+
rules: [
13+
{
14+
test: /\.js$/,
15+
use: {
16+
loader: 'babel-loader',
17+
options: {
18+
babelrc: false,
19+
plugins: [
20+
['transform-class-properties', { loose: true }],
21+
'transform-object-rest-spread',
22+
],
23+
presets: [
24+
['latest', { es2015: { loose: true, modules: false } }],
25+
'react',
26+
],
27+
},
28+
},
29+
exclude: /node_modules/,
30+
},
31+
],
32+
},
33+
}

‎package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "recompact",
33
"version": "2.3.2",
44
"description": "A set of React high order components based on Rx.",
5-
"main": "index.js",
5+
"main": "recompact.js",
66
"repository": {
77
"url": "git@github.com:neoziro/recompact.git",
88
"type": "git"
@@ -11,7 +11,7 @@
1111
"build": "yarn build:doc && yarn build:lib",
1212
"build:doc": "NODE_ENV=production babel-node ./scripts/build-doc",
1313
"build:lib": "rm -rf lib/ && NODE_ENV=production babel --ignore src/__tests__ src -d lib && cp package.json lib/package.json && rm -rf lib/__benchmarks__",
14-
"examples": "webpack-dev-server",
14+
"examples": "webpack-dev-server --config examples/webpack.config.babel.js",
1515
"release": "mversion `conventional-recommended-bump -p angular` -m",
1616
"test": "eslint . && jest --runInBand --coverage && codecov"
1717
},
@@ -47,11 +47,11 @@
4747
"devDependencies": {
4848
"babel-cli": "^6.24.1",
4949
"babel-eslint": "^7.2.3",
50-
"babel-jest": "^19.0.0",
5150
"babel-loader": "^7.0.0",
51+
"babel-plugin-transform-class-properties": "^6.24.1",
52+
"babel-plugin-transform-object-rest-spread": "^6.23.0",
5253
"babel-preset-latest": "^6.24.1",
5354
"babel-preset-react": "^6.24.1",
54-
"babel-preset-stage-0": "^6.24.1",
5555
"benchmark": "^2.1.4",
5656
"codecov": "^2.1.0",
5757
"conventional-github-releaser": "^1.1.3",

‎scripts/build-lib.sh

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Clean it
2+
rm -rf lib/
3+
4+
# Compile babel sources
5+
NODE_ENV=production babel --ignore src/__tests__,src/__benchmarks__ src -d lib
6+
7+
# Compile webpack umd
8+
NODE_ENV=production webpack
9+
10+
# Copy package.json
11+
cp package.json lib/package.json

‎src/__tests__/mapPropsStream.test.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ describe('mapPropsStream', () => {
7979
it('does not render the base component before props are emitted', () => {
8080
const trigger$ = new Subject()
8181
const EnhancedDummy = compose(
82-
mapPropsStream(props$ => props$::combineLatest(trigger$, props => props)),
82+
mapPropsStream(props$ => combineLatest.call(props$, trigger$, props => props)),
8383
countRenders,
8484
)(Dummy)
8585

‎src/connectObs.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ const connectObs = obsMapper => withObs((observables) => {
7878
if (key.match(/^on[A-Z]/)) {
7979
const observable = obsMap[key]
8080
checkObserver(observable, key)
81-
obsProps[key] = ::observable.next
81+
obsProps[key] = observable.next.bind(observable)
8282
} else {
8383
const observable = obsConfig.toESObservable(obsMap[key])
8484
checkObservable(observable, key)

0 commit comments

Comments
 (0)
0