@shopify/react-serialize - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

package.json

 {
   "name": "@shopify/react-serialize",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "license": "MIT",
@@ -5,0 +5,0 @@ "description": "Provides an idiomatic way to serialize data for rehydration in a universal react application.",

README.md

@@ -10,1 +10,37 @@ # `@shopify/react-serialize`
 ```
+
+## Usage
+
+On the server, the `<Serializer />` component will serialize whatever you pass as it's `data` prop.
+
+```javascript
+// in your server renderer
+import {Serializer} from '@shopify/react-serialize';
+
+...
+
+const apolloState = getDatafromTree(appMarkup)
+
+const markup = react.renderToString(
+  <React.Fragment>
+    {appMarkup}
+    <Serializer id="apollo-data" data={apolloState}>
+  </React.Fragment>
+);
+```
+
+Then on the client, you can use `getSerialized` to fetch that data out of the DOM and initialize whatever you need.
+
+```javascript
+// when you are rehydrating on the client
+import {getSerialized} from '@shopify/react-serialize';
+import ApolloClient from 'apollo-client';
+
+...
+
+const {data: initialApolloData} = getSerialized('apollo-data');
+const client = new ApolloClient({
+  ...myConfig,
+  cache: cache.restore(initialApolloData),
+});
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

9491

increased by9.89%

Number of lines in readme file

46

increased by360%

No dependency changes