hook ou hoc ?

Image for post
Image for post

La semaine dernière j’ai rencontré une problématique liée aux validators dans les inputs de notre application. Je me suis rendu compte que les inputs étaient multiples: création de rooms, créations de groupes de discussion, recherches d’utilisateurs, régénération de mot de passe…

Mon objectif fut de créer du code qui soit réutilisable pour chacun de mes inputs et de ne pas avoir à créer une gestion des validators différentes à chaque component. Je suis donc parti sur l’idée d’utiliser un high order component (HOC).

Un HOC est une fonction qui prend en argument un component et qui va retourner un nouveau component dans lequel sera ‘wrappé’ le premier, lui offrant de nouvelles possibilités. Avec le concours de mon collègue Quentin Rouault, j’ai réussi à mettre ce HOC sur pied. …


Image for post
Image for post

Que penseriez-vous de créer des composants React stateless sans pour autant subir les re-rendering de ce dernier ?

L’Api de React nous permettait déjà de créer des PureComponent. Nous pouvions dès lors créer des composants qui effectuerait un rendu chaque fois que les props changeraient et seulement dans ce cas. Le seul inconvénient c’est que le PureComponent se crée à partir d’une classe et non d’une simple fonction.

Comment peut-on éviter les re-rendering systématiques en utilisant un stateless component ?

La réponse de React se trouve dans la mise à jour 16.6.0 et elle répond au nom de React.memo().

Une nouvelle façon d’utiliser le component stateless : un nouveau rendu sera effectué seulement si les props changent. …

About

Tony Gorez

Just a coder I suppose … | Software Engineer | @goreztony

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store