Add enterprise-commerce to Best of JS

[bmstefanski]

Hi again @michaelrambeau :)!

Please briefly describe the project you'd like to add to Best of JS?

Next.js storefront for high-performance eCommerce with AI features

What is the GitHub repository of the project you'd like to add to Best of JS?

https://github.com/Blazity/enterprise-commerce

Before submitting the request to add a new project, please check the following points:

• [x] The project is related to the web platform or Node.js
• [x] The source code is on GitHub and project has more than 100 stars on GitHub
• [x] The project has thorough documentation in English
• [x] The project is not deprecated and actively maintained

How would this project be tagged? (Pick one or several existing tags from this list: https://bestofjs.org/tags)

E-commerce, Next.js, React, TailwindCSS (?), Boilerplate (?)

P.S While browsing tags view I found a bug:

• go to https://bestofjs.org/tags?sort=project-count&page=8 (or any other page number)
• type something (e.g. e-commerce) in the autocomplete box (cmd+k)
• you will be redirected to a page with no results, because it preserves the page query param

Also you can suggest new tags to add if you think Best of JS is missing useful tags.

Probably AI, since it's a hot topic now

[michaelrambeau]

Hello Bart @bmstefanski Thank you for the suggestion, entreprise-commerce will be available on Best of JS very soon.

We have tags such as Machine Learning and Neural Network but we need a more generic "AI", you are right!

Thank you for the bug report too, I will fix as soon as possible and ping you again later.

[michaelrambeau]

@bmstefanski The bug you reported should be fixed, let me know if you find anything wrong about the search feature or if you think about any improvement as it's a crucial feature, to me.

About the project addition, stay tuned, it's coming! 📻 😄

[bmstefanski]

Thanks! It genuinely looks and works great.

Potential improvements that would make the performance a little bit better:

• Pagination is slower than it could be. On my 1gbps connection it takes close to 1s to change the view to the next page. From what I see you're using SSR with node runtime (and you're hitting the cache) and you're also using next/link for prefetching next pages - so that's great. You could think about moving to ISR/Static. Your Speed Index metric would improve and that 1s delay would probably disappear. I am guessing it's not possible now due to the URL structure (page as query param). If your URL structure looked more like this: /projects/1?tags=react&sort it would be possible to run ISR there and rewrite users (through middleware) to SSR version when they select some tags or other filters, example -> https://github.com/Blazity/enterprise-commerce/blob/main/apps/web/middleware.ts#L94
• the paginated view uses Suspense/Streaming so it won't work with JS disabled - while it's still crawlable, it will take longer for Google bot to crawl this and might or might not impact the SEO

[michaelrambeau]

Hello @bmstefanski enterprise-commerce is available in Best of JS, please check:

https://bestofjs.org/projects/enterprise-commerce

Let me know if there a NPM package we could add (to show the graph of the monthly downloads).

Also I added a tag called "AI": https://bestofjs.org/projects?tags=ai (we must miss some great projects in this category)

---

Thank you very much for the feedback about the search feature.

Last year, when I migrated from a SPA to a Next.js app, the latency you described annoyed me. It's a bit slow but the worse is the absence of feedback when you click on the pagination button,to me, it feels like a regression.

Every project list page is actually a paginated search result page with the following parameters:

• tags
• order (by default we show projects by total number of stars but several other metrics are available)
• page

This is why we rely on query string parameters and there is no way to build "in advance" static pages when query strings are involved (it would be great if we could build some popular combinations).

So we could improve the situation by introducing some path parameters for the most common pages. You mentioned the pagination for the "all projects" page (I think it's what you checked) but an even more common case is when you click on a given tag link, https://bestofjs.org/projects?tags=react for the React tag for example.

I thought about having a path like /tags/react that would be the same as /projects?tags=react. The tricky part is that any extra query string parameter (order or page) should not map to the statically generated /tags/react page.

About your last point, the navigation was supposed to work without JavaScript, it used to work at some point, I will investigate more. I'm not sure it's because of Suspense because I don't think Suspense is used in the /projects page.