Το νέο χαρακτηριστικό στο React 19 που επιτρέπει τη διέλευση των αναφορών ως σκηνικά αντί να χρησιμοποιεί το `forwardref` μπορεί να βελτιώσει την αποτελεσματικότητα της ανάπτυξης με μερικούς βασικούς τρόπους:
απλούστερο και πιο διαισθητικό API
Το Passing Refs ως κανονικά στηρίγματα είναι ένα πιο φυσικό και διαισθητικό API σε σύγκριση με τη χρήση του `forwardref '. Ευθυγραμμίζεται καλύτερα με την αρχή του πυρήνα αντιδρά την διέλευση δεδομένων κάτω από το δέντρο των στοιχείων μέσω των στηρίξεων. Αυτό καθιστά τον κώδικα ευκολότερο στην κατανόηση και τη λογική, ειδικά για αρχάριους.
Μειωμένο boilerplate
Η χρήση του `forwardref` απαιτεί την περιτύλιξη του συστατικού του παιδιού σε μια κλήση` forwardref` και περνώντας το `ref` ως το δεύτερο επιχείρημα στο στοιχείο λειτουργίας. Αυτό προσθέτει κάποιο κωδικό boilerplate. Η διέλευση του ref απευθείας ως προώθησης εξαλείφει αυτόν τον επιπλέον κώδικα.
καλύτερη ενθυλάκωση
Όταν χρησιμοποιείτε το `ForwardRef`, το παιδικό στοιχείο πρέπει να γνωρίζει ότι λαμβάνει ένα ref και πρέπει να το επισυνάψει στο κατάλληλο στοιχείο DOM. Η διέλευση του ref ως στήριγμα επιτρέπει στο στοιχείο του παιδιού να παραμένει αγνοώντας το ref, βελτιώνοντας την ενθυλάκωση.
ευκολότερη refactoring
Εάν πρέπει να επαναπροσδιορίσετε ένα δέντρο εξαρτημάτων και να αλλάξετε το σημείο προσάρτησης REF, είναι απλούστερο να ενημερώσετε το όνομα Prop αντί να ενημερώσετε την κλήση `ForwardRef` σε πολλά μέρη. Αυτό καθιστά το base code πιο διατηρήσιμο.
Σύμφωνα με τα στοιχεία της κλάσης
Στα εξαρτήματα της κλάσης, τα refs επισυνάπτονται χρησιμοποιώντας το prop `ref, όχι μέσω ενός ειδικού μηχανισμού` forwardref`. Το να επιτρέπεται η αναφορά ως στηρίγματα στα εξαρτήματα της λειτουργίας παρέχει ένα πιο συνεπές API μεταξύ των στοιχείων κλάσης και λειτουργίας.
ευκολότερος έλεγχος τύπου
Όταν χρησιμοποιείτε το TypeScript, είναι απλούστερο να πληκτρολογήσετε ένα ref που έχει περάσει ως στήριγμα σε σύγκριση με τη χρήση τύπων `forwardref` και` refattributes`. Ο τύπος προώθησης μπορεί να συναχθεί απευθείας από το αντικείμενο `ref`.
Συνοπτικά, η λειτουργία New Refs As Props καθιστά το API React πιο διαισθητικό, μειώνει το boilerplate, βελτιώνει την ενθυλάκωση και καθιστά το codebase πιο διατηρήσιμο - όλα τα οποία βελτιώνουν την αποτελεσματικότητα των προγραμματιστών όταν εργάζονται με Refs στο React 19 και Beyond [1] [3] [4].
Αναφορές:[1] https://www.copycat.dev/blog/react-forwardref/
[2] https://stackoverflow.com/questions/58578570/value-of-using-react-forwardref-vs-custom-ref-prop
[3] https://legacy.reactjs.org/docs/forwarding-refs.html
[4] https://www.reddit.com/r/rectjs/comments/1asgpy9/ref_as_a_prop_advance_beginner_question/
[5] https://blog.logrockocket.com/why-you-should-use-refs-sparingly-in-production/
[6] https://react.dev/blog/2024/04/25/react-19-upgrade-guide
[7] https://dev.to/dalcio/react-performance-usestate-reducer-ref- θεωρητική-καλοκαίρι-1bok
[8] https://www.freecodecamp.org/news/new-react-19-features/