Skip to content

Commit 45facee

Browse files
committed
README initial API descriptions
1 parent 4b4c5a2 commit 45facee

File tree

1 file changed

+129
-0
lines changed

1 file changed

+129
-0
lines changed

README.md

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
# ReactCC
2+
3+
## Overview
4+
5+
## Installation
6+
Using npm:
7+
```shell
8+
$ npm install --save rapscallion
9+
```
10+
11+
## Usage
12+
#In Node rendering server:
13+
```javascript
14+
const ReactCC = require("reactcc");
15+
16+
// ...
17+
```
18+
19+
#In React app:
20+
To cache a component, simply add a 'cache' property to it. To create a cache template, add both 'cache' and 'templatized'.
21+
22+
```javascript
23+
export default class App extends Component {
24+
render() {
25+
return (
26+
<div>
27+
<ComponentNotToBeCached />
28+
<ComponentToCache cache />
29+
<ComponentToTemplatize cache templatized='props to templatize' />
30+
</div>
31+
);
32+
}
33+
}
34+
// ...
35+
```
36+
37+
## Cache Options
38+
ReactCC provides its own cache implementation as well as support for Redis and Memcached. Simply create your preferred cache and pass it into one of the rendering methods.
39+
40+
**ReactCC LRU Cache Example:**
41+
42+
```javascript
43+
const cache = ReactCC.ComponentCache();
44+
45+
ReactCC.renderToString(<App />, cache);
46+
```
47+
48+
**Redis Example:**
49+
50+
```javascript
51+
const ReactCC = require("reactcc");
52+
const redis = require("redis");
53+
54+
const cache = redis.createClient();
55+
56+
ReactCC.renderToString(<App />, cache);
57+
```
58+
59+
**Memcached Example:**
60+
61+
```javascript
62+
const ReactCC = require("reactcc");
63+
const Memcached = require("memcached");
64+
65+
const cache = new Memcached(server location, options);
66+
67+
// Make sure to pass in the lifetime of the data (in seconds) as a number.
68+
ReactCC.renderToString(<App />, cache, 1000);
69+
```
70+
71+
## API
72+
73+
### `ReactCC`
74+
ReactCC gives you access to all four of React 16's server-side rendering methods, as well as additional functionality. ReactCC methods are described below.
75+
76+
### `ComponentCache`
77+
- `size`: (Optional) An integer representing the maximum size (in characters) of the cache. Defaults to 1 million.
78+
79+
**Example:**
80+
81+
```javascript
82+
const cache = new ReactCC.ComponentCache();
83+
```
84+
85+
### renderToString
86+
- `component`: The React component being rendered.
87+
- `cache`: The component cache
88+
- `memLife`: (Only if using Memcached) A number representing the lifetime (in seconds) of each Memcached entry. Defaults to 0.
89+
90+
**Example:**
91+
92+
```javascript
93+
ReactCC.renderToString(<App />, cache);
94+
```
95+
96+
### renderToStaticMarkup
97+
- `component`: The React component being rendered.
98+
- `cache`: The component cache
99+
- `memLife`: (Only if using Memcached) An integer representing the lifetime (in seconds) of each Memcached entry. Defaults to 0.
100+
101+
**Example:**
102+
103+
```javascript
104+
ReactCC.renderToStaticMarkup(<App />, cache);
105+
```
106+
107+
### renderToNodeStream
108+
- `component`: The React component being rendered.
109+
- `cache`: The component cache
110+
- `memLife`: (Only if using Memcached) An integer representing the lifetime (in seconds) of each Memcached entry. Defaults to 0.
111+
112+
**Example:**
113+
114+
```javascript
115+
ReactCC.renderToNodeStream(<App />, cache);
116+
```
117+
118+
### renderToStaticNodeStream
119+
- `component`: The React component being rendered.
120+
- `cache`: The component cache
121+
- `memLife`: (Only if using Memcached) An integer representing the lifetime (in seconds) of each Memcached entry. Defaults to 0.
122+
123+
**Example:**
124+
125+
```javascript
126+
ReactCC.renderToStaticNodeStream(<App />, cache);
127+
```
128+
129+
-----

0 commit comments

Comments
 (0)