Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Algolia's Instant Search Example #14233

Merged

Conversation

chuabingquan
Copy link
Contributor

  • Moved from getInitialProps to getServerSideProps
  • Update Algolia libraries

Co-authored-by: Arsalan Khattak akkhattak65@gmail.com

- Moved from `getInitialProps` to `getServerSideProps`
- Update Algolio libraries

Co-authored-by: Arsalan Khattak <akkhattak65@gmail.com>
@ijjk ijjk added the examples Issue/PR related to examples label Jun 16, 2020
@ijjk
Copy link
Member

ijjk commented Jun 16, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
buildDuration 12s 12.3s ⚠️ +322ms
nodeModulesSize 67 MB 67 MB
Page Load Tests Overall increase ✓
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
/ failed reqs 0 0
/ total time (seconds) 2.02 2.028 ⚠️ +0.01
/ avg req/sec 1237.7 1232.94 -4.76
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.224 1.168 -0.06
/error-in-render avg req/sec 2042.31 2141.05 ⚠️ +98.74
Client Bundles (main, webpack, commons)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.js gzip 6.51 kB 6.51 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..4dd5.js gzip 10.5 kB 10.5 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 56.9 kB 56.9 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.module.js gzip 5.6 kB 5.6 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 52.4 kB 52.4 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
_error.js gzip 3.37 kB 3.37 kB
index.js gzip 222 B 222 B
link.js gzip 2.05 kB 2.05 kB
hooks.js gzip 881 B 881 B
_app.js gzip 1.26 kB 1.26 kB
Overall change 8.34 kB 8.34 kB
Client Pages Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.module.js gzip 223 B 223 B
routerDirect..dule.js gzip 281 B 281 B
withRouter.m..dule.js gzip 278 B 278 B
hooks.module.js gzip 383 B 383 B
_error.module.js gzip 2.21 kB 2.21 kB
link.module.js gzip 1.52 kB 1.52 kB
_app.module.js gzip 604 B 604 B
Overall change 5.49 kB 5.49 kB
Client Build Manifests
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_buildManifest.js gzip 270 B 270 B
_buildManife..dule.js gzip 274 B 274 B
Overall change 544 B 544 B
Rendered Page Sizes
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.html gzip 954 B 954 B
link.html gzip 961 B 961 B
withRouter.html gzip 947 B 947 B
Overall change 2.86 kB 2.86 kB

Serverless Mode
General
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
buildDuration 13s 13.3s ⚠️ +313ms
nodeModulesSize 67 MB 67 MB
Client Bundles (main, webpack, commons)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.js gzip 6.51 kB 6.51 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..4dd5.js gzip 10.5 kB 10.5 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 56.9 kB 56.9 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.module.js gzip 5.6 kB 5.6 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 52.4 kB 52.4 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
_error.js gzip 3.37 kB 3.37 kB
index.js gzip 222 B 222 B
link.js gzip 2.05 kB 2.05 kB
hooks.js gzip 881 B 881 B
_app.js gzip 1.26 kB 1.26 kB
Overall change 8.34 kB 8.34 kB
Client Pages Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.module.js gzip 223 B 223 B
routerDirect..dule.js gzip 281 B 281 B
withRouter.m..dule.js gzip 278 B 278 B
hooks.module.js gzip 383 B 383 B
_error.module.js gzip 2.21 kB 2.21 kB
link.module.js gzip 1.52 kB 1.52 kB
_app.module.js gzip 604 B 604 B
Overall change 5.49 kB 5.49 kB
Client Build Manifests
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_buildManifest.js gzip 270 B 270 B
_buildManife..dule.js gzip 274 B 274 B
Overall change 544 B 544 B
Serverless bundles
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_error.js 875 kB 875 kB
404.html 4.17 kB 4.17 kB
hooks.html 3.79 kB 3.79 kB
index.js 875 kB 875 kB
link.js 913 kB 913 kB
routerDirect.js 906 kB 906 kB
withRouter.js 906 kB 906 kB
Overall change 4.48 MB 4.48 MB

Copy link
Member

@lfades lfades left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The app is working as expected, but I don't see how is SSR being used here, even if I set a custom query it will make the search after the first render, A fix for that is welcome, or you can remove SSR entirely (Remove getServerSideProps), and make the query only in the client.

@chuabingquan chuabingquan requested a review from lfades June 18, 2020 12:52
@chuabingquan
Copy link
Contributor Author

The app is working as expected, but I don't see how is SSR being used here, even if I set a custom query it will make the search after the first render, A fix for that is welcome, or you can remove SSR entirely (Remove getServerSideProps), and make the query only in the client.

I've removed SSR entirely as requested, do let me know if further changes are needed!

@ijjk
Copy link
Member

ijjk commented Jun 18, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
buildDuration 12s 11.9s -45ms
nodeModulesSize 67 MB 67 MB
Page Load Tests Overall increase ✓
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
/ failed reqs 0 0
/ total time (seconds) 2.034 2.087 ⚠️ +0.05
/ avg req/sec 1229.11 1197.76 -31.35
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.245 1.216 -0.03
/error-in-render avg req/sec 2008.69 2055.16 ⚠️ +46.47
Client Bundles (main, webpack, commons)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.js gzip 6.51 kB 6.51 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..4dd5.js gzip 10.5 kB 10.5 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 56.9 kB 56.9 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.module.js gzip 5.6 kB 5.6 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 52.4 kB 52.4 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
_error.js gzip 3.37 kB 3.37 kB
index.js gzip 222 B 222 B
link.js gzip 2.05 kB 2.05 kB
hooks.js gzip 881 B 881 B
_app.js gzip 1.26 kB 1.26 kB
Overall change 8.34 kB 8.34 kB
Client Pages Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.module.js gzip 223 B 223 B
routerDirect..dule.js gzip 281 B 281 B
withRouter.m..dule.js gzip 278 B 278 B
hooks.module.js gzip 383 B 383 B
_error.module.js gzip 2.21 kB 2.21 kB
link.module.js gzip 1.52 kB 1.52 kB
_app.module.js gzip 604 B 604 B
Overall change 5.49 kB 5.49 kB
Client Build Manifests
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_buildManifest.js gzip 270 B 270 B
_buildManife..dule.js gzip 274 B 274 B
Overall change 544 B 544 B
Rendered Page Sizes
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.html gzip 953 B 953 B
link.html gzip 960 B 960 B
withRouter.html gzip 947 B 947 B
Overall change 2.86 kB 2.86 kB

Serverless Mode
General
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
buildDuration 13.1s 13s -112ms
nodeModulesSize 67 MB 67 MB
Client Bundles (main, webpack, commons)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.js gzip 6.51 kB 6.51 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..4dd5.js gzip 10.5 kB 10.5 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 56.9 kB 56.9 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
main-HASH.module.js gzip 5.6 kB 5.6 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 52.4 kB 52.4 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
_error.js gzip 3.37 kB 3.37 kB
index.js gzip 222 B 222 B
link.js gzip 2.05 kB 2.05 kB
hooks.js gzip 881 B 881 B
_app.js gzip 1.26 kB 1.26 kB
Overall change 8.34 kB 8.34 kB
Client Pages Modern
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
index.module.js gzip 223 B 223 B
routerDirect..dule.js gzip 281 B 281 B
withRouter.m..dule.js gzip 278 B 278 B
hooks.module.js gzip 383 B 383 B
_error.module.js gzip 2.21 kB 2.21 kB
link.module.js gzip 1.52 kB 1.52 kB
_app.module.js gzip 604 B 604 B
Overall change 5.49 kB 5.49 kB
Client Build Manifests
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_buildManifest.js gzip 270 B 270 B
_buildManife..dule.js gzip 274 B 274 B
Overall change 544 B 544 B
Serverless bundles
vercel/next.js canary MLH-Fellowship/next.js update-algolia-react-instantsearch-example Change
_error.js 875 kB 875 kB
404.html 4.17 kB 4.17 kB
hooks.html 3.79 kB 3.79 kB
index.js 875 kB 875 kB
link.js 914 kB 914 kB
routerDirect.js 906 kB 906 kB
withRouter.js 906 kB 906 kB
Overall change 4.48 MB 4.48 MB

Copy link
Member

@lfades lfades left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, thank you!

Feel free to also update the readme in another PR as the current instructions feel very unclear to me.

@lfades lfades merged commit ca49c54 into vercel:canary Jun 19, 2020
@timneutkens timneutkens deleted the update-algolia-react-instantsearch-example branch June 19, 2020 06:34
rokinsky pushed a commit to rokinsky/next.js that referenced this pull request Jul 11, 2020
* Update Algolio's Instant Search Example
- Moved from `getInitialProps` to `getServerSideProps`
- Update Algolio libraries

Co-authored-by: Arsalan Khattak <akkhattak65@gmail.com>

* Shift from SSR to CSR

Co-authored-by: Arsalan Khattak <akkhattak65@gmail.com>
kodiakhq bot pushed a commit that referenced this pull request Sep 25, 2020
As clear from [#14233](#14233 (comment)) that the 'with-algolia example is not SSR', I've updated the documentation to clear the confusion caused, as visible in #17229 

Fixes #17229
HitoriSensei pushed a commit to HitoriSensei/next.js that referenced this pull request Sep 26, 2020
As clear from [vercel#14233](vercel#14233 (comment)) that the 'with-algolia example is not SSR', I've updated the documentation to clear the confusion caused, as visible in vercel#17229 

Fixes vercel#17229
@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
examples Issue/PR related to examples
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants