W jaki sposób nowy ref, jako funkcja rekwizytów poprawia wydajność rozwoju

prostszy i bardziej intuicyjny interfejs API

Przekazywanie remontu jako zwykłych rekwizytów jest bardziej naturalnym i intuicyjnym API w porównaniu z użyciem „forwardref”. Lepiej łączy się z zasadą reagowania podstawowego przenoszenia danych w dół drzewa komponentu za pomocą rekwizytów. To sprawia, że ​​kod jest łatwiejszy do zrozumienia i rozumu, szczególnie dla początkujących.

Zmniejszona płyta kotła

Użycie „forwardRef” wymaga owijania komponentu dziecięcego w wywołaniu `forwardRef` i przekazywania„ ref ”jako drugiego argumentu do komponentu funkcji. To dodaje kod płyty kotła. Przekazanie Ref bezpośrednio jako proponowanie eliminuje ten dodatkowy kod.

Lepiej enkapsulacja

Podczas korzystania z „forwardRef` komponent dziecięcy musi być świadomy, że otrzymuje ref i musi go dołączyć do odpowiedniego elementu DOM. Przekazywanie sędziego jako rekwizytu pozwala komponentowi dziecięcemu pozostać nieświadomym ref, poprawiając kapsułkowanie.

łatwiejsze refaktoryzacja

Jeśli chcesz przetworzyć drzewo komponentów i zmienić punkt załącznika Ref, prostsze jest aktualizacja nazwy rekwizytu niż konieczność aktualizacji wywołania „ForwardRef” w wielu miejscach. To sprawia, że ​​baza kodowa jest bardziej możliwe do utrzymania.

Zgodnie z komponentami klasowymi

W komponentach klasowych Refs są dołączane przy użyciu proponowania „ref”, a nie za pomocą specjalnego mechanizmu `forwardRef '. Umożliwianie Refs jako rekwizytów w komponentach funkcji zapewnia bardziej spójny interfejs API między komponentami klasy i funkcji.

łatwiej sprawdzać typ

Podczas korzystania z TypeScript prostsze jest pisanie sprawdzania ref przekazanego jako rekwizytu w porównaniu z użyciem typów `forwardRef` i„ refattributes ”. Typ rekwizytów można wywnioskować bezpośrednio z obiektu „ref”.

Podsumowując, nowa funkcja rekwizytów jako rekwizytów sprawia, że ​​API React jest bardziej intuicyjne, zmniejsza płytę kotłową, poprawia enkapsulację i sprawia, że ​​baza kodowa jest bardziej utrzymana - z których wszystkie poprawia wydajność programisty podczas pracy z React 19 i później [1] [3] [4].