web-dev-qa-db-fra.com

Next js - désactiver le rendu côté serveur sur certaines pages

Est-il possible de désactiver ssr sur certaines pages en utilisant Next js? Par exemple, j'ai une page avec une description de produit sur laquelle j'utilise ssr pour le référencement mais j'ai aussi une page avec une liste d'articles ou de produits que je peux filtrer et pour cette page, je ne veux pas utiliser ssr car cela page génère dynamiquement à chaque fois, comment puis-je désactiver ssr sur cette page?

20
gigs

Lazy charge le composant et désactive SSR.
https://github.com/zeit/next.js#3-with-no-ssr

import dynamic from 'next/dynamic'

const DynamicComponentWithNoSSR = dynamic(() => import('../components/List'), {
  ssr: false
})

export default () => (
  <div>
    <DynamicComponentWithNoSSR />
  </div>
)
2
gg_

Vous ne pouvez pas désactiver le SSR. lire la suite ..

Si vous souhaitez lancer quelque chose uniquement côté client, vous pouvez utiliser la fonction componentDidMount lifeCycle. Alors que si vous souhaitez lancer depuis le côté serveur, vous pouvez utiliser la fonction getInitialProps .

1

Nous pouvons également utiliser react-no-ssr React component).

Disons que Commentaires est notre composant client uniquement. Maintenant, nous devons le rendre uniquement sur le client. Voici comment nous procédons.

import React from 'react';
import NoSSR from 'react-no-ssr';
import Comments from './comments.jsx';

const MyPage = () => (
  <div>
    <h2>My Blog Post</h2>
    <hr />
    <NoSSR>
      <Comments />
    </NoSSR>
  </div>
);
0
refactor