Προγραμματισμός

Τι νέο υπάρχει στη βιβλιοθήκη React JavaScript UI

Τώρα διαθέσιμο στην έκδοση παραγωγής, η Έκδοση 16.8 της βιβλιοθήκης React JavaScript UI έχει τη δυνατότητα αγκίστρων, για τη χρήση κατάστασης και άλλων λειτουργιών React χωρίς να χρειάζεται να γράψει μια τάξη.

Πού να κατεβάσετε το React

Μπορείτε να κατεβάσετε την έκδοση προϊόντος του React από το GitHub.

Τρέχουσα έκδοση: Νέες δυνατότητες στο React 16.8

Κυκλοφόρησε τον Φεβρουάριο του 2019, το React 168 παρέχει μια εφαρμογή αγκιστριών για το DOM, το διακομιστή DOM, το δοκιμαστικό rendering και το ρηχό rendering. Τα άγκιστρα υποστηρίζονται στο React DevTools. Οι προγραμματιστές μπορούν να δημιουργήσουν τα δικά τους άγκιστρα για να μοιραστούν επαναχρησιμοποιούμενη κρατική λογική μεταξύ των στοιχείων. Ωστόσο, το Facebook συμβουλεύει τους προγραμματιστές να αφιερώσουν το χρόνο τους με αυτήν την ικανότητα, χωρίς να προτείνει στους προγραμματιστές να ξαναγράψουν εφαρμογές για να χρησιμοποιούν αγκίστρια «μια μέρα στην άλλη».

Δεν υπάρχουν σχέδια για κατάργηση τάξεων από το React, επομένως οι προγραμματιστές θα πρέπει να δοκιμάσουν αγκίστρι σε ορισμένα νέα στοιχεία. Ο κώδικας που χρησιμοποιεί οποιοδήποτε άγκιστρο λειτουργεί μαζί με τον υπάρχοντα κώδικα χρησιμοποιώντας τάξεις.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.7

Κυκλοφόρησε τον Δεκέμβριο του 2018, το React 16.7 προσθέτει την ικανότητα των αγκιστριών, για τη χρήση της κατάστασης και άλλων λειτουργιών του React χωρίς να γράφει τάξη.

Οι γάντζοι είναι συναρτήσεις που συνδέονται με λειτουργίες κατάστασης αντιδράσεων και κύκλου ζωής από στοιχεία συνάρτησης. Επί του παρόντος λειτουργούν παράλληλα με τον υπάρχοντα κώδικα, επιτρέποντας τη σταδιακή υιοθέτηση. Δεν υπάρχουν σχέδια για την πραγματική κατάργηση τάξεων από το React. Οι γάντζοι επιλύουν διάφορα προβλήματα στο React, όπως:

  • Η έλλειψη τρόπου για να επισυνάψετε μια επαναχρησιμοποιήσιμη συμπεριφορά σε ένα στοιχείο. Υπήρξαν μοτίβα όπως στοιχεία στήριξης και στοιχεία υψηλότερης τάξης που προσπαθούν να το λύσουν, αλλά αυτά απαιτούν αναδιάρθρωση στοιχείων, τα οποία μπορεί να είναι δυσκίνητα και δυσκολεύουν την παρακολούθηση του κώδικα. Χρησιμοποιώντας άγκιστρα, οι προγραμματιστές μπορούν να εξαγάγουν λογική κατάσταση από ένα στοιχείο για ανεξάρτητες δοκιμές και επαναχρησιμοποίηση.
  • Πολύπλοκα συστατικά έχουν γίνει πολύ δύσκολο να κατανοηθούν. Με άγκιστρα, τα στοιχεία μπορούν να χωριστούν σε μικρότερες λειτουργίες βάσει σχετικών κομματιών, όπως ρύθμιση συνδρομής ή ανάκτηση δεδομένων. Αυτό γίνεται αντί να εξαναγκάζεται μια διάσπαση βάσει μεθόδων κύκλου ζωής.
  • Τα μαθήματα μπορούν να προκαλέσουν σύγχυση τόσο στους ανθρώπους όσο και στις μηχανές και θεωρούνται ως το μεγαλύτερο εμπόδιο στη μάθηση του React. Οι γάντζοι επιτρέπουν στους προγραμματιστές να χρησιμοποιούν περισσότερες από τις λειτουργίες του React χωρίς μαθήματα. Οι Hooks αγκαλιάζουν λειτουργίες, αλλά χωρίς να θυσιάζουν το πνεύμα του React. Η πρόσβαση παρέχεται σε επιτακτικές καταπακτές διαφυγής. Οι προγραμματιστές δεν χρειάζεται να μάθουν πολύπλοκες λειτουργικές ή αντιδραστικές τεχνικές προγραμματισμού.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.6

Κυκλοφόρησε τον Οκτώβριο του 2018, το React 16.6 παρέχει πολλές βελτιώσεις.

  • Με σημείωμα, οι προγραμματιστές μπορούν να ξεφύγουν από την απόδοση με στοιχεία λειτουργίας, παρόμοια με τον τρόπο με τον οποίο τα εξαρτήματα της κλάσης μπορούν να αποφύγουν την απόδοση όταν τα στηρίγματα εισόδου είναι τα ίδια PureComponents ή shouldComponentUpdate.
  • Με τεμπέλης, οι προγραμματιστές μπορούν να χρησιμοποιήσουν το Αγωνία στοιχείο για διαχωρισμό κωδικών τυλίγοντας μια δυναμική εισαγωγή σε κλήση προς React.lazy (). Σημείωση: Η δυνατότητα δεν είναι ακόμη διαθέσιμη για απόδοση από διακομιστή.
  • Το API ευκολίας εισήχθη για να καταναλώσει μια τιμή περιβάλλοντος μέσα από ένα στοιχείο κλάσης. Οι προγραμματιστές παραπονέθηκαν ότι η υιοθέτηση του νέου API στήριξης απόδοσης από το React 16.3 θα μπορούσε να είναι δύσκολη στα στοιχεία της κλάσης.
  • Μια μέθοδος σφάλματος, getDerivedStatefromError (), αποδίδει το εναλλακτικό περιβάλλον εργασίας πριν ολοκληρωθεί η απόδοση. Σημείωση: Δεν είναι ακόμη διαθέσιμο για απόδοση από διακομιστή, αλλά οι προγραμματιστές μπορούν να αρχίσουν να προετοιμάζονται για αυτό.
  • Δύο Strictmode Τα API έχουν καταργηθεί: εύρεσηDOMNode () και το κληρονομικό πλαίσιο χρήσης Τύπος περιβάλλοντος και getChildContext. Οι προγραμματιστές ενθαρρύνονται να κάνουν αναβάθμιση στο νέο Τύπος περιβάλλοντος API.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.4

Η έκδοση 16.4 του React, που κυκλοφόρησε στα τέλη Μαΐου 2018, προσθέτει υποστήριξη για συμβάντα δείκτη, μια συχνά ζητούμενη δυνατότητα, καθώς και μια βελτίωση για μια επερχόμενη ασύγχρονη ικανότητα απόδοσης. Τα προγράμματα περιήγησης που υποστηρίζουν συμβάντα δείκτη περιλαμβάνουν εκδόσεις του Google Chrome, του Mozilla Firefox, του Microsoft Edge και του Microsoft Internet Explorer.

Τα συμβάντα δείκτη είναι συμβάντα DOM που ενεργοποιούνται για μια συσκευή κατάδειξης, σχεδιασμένη να παρέχει ένα μοντέλο συμβάντος για τη διαχείριση συσκευών όπως το ποντίκι ή το άγγιγμα.

Με την υποστήριξη για συμβάντα δείκτη, το React προσθέτει υποστήριξη για τύπους συμβάντων που περιλαμβάνουν:

  • στοPointerDow
  • onPointerMove
  • onPointerUp
  • onPointerCancel
  • onGotPointerCapture
  • onLostPointerCapture
  • onPointerEnter
  • onPointerLeave
  • onPointerOver
  • onPointerOut

Άλλες νέες δυνατότητες στο React 16.4 περιλαμβάνουν:

  • Βελτιωμένη συμβατότητα με μια προγραμματισμένη ασύγχρονη λειτουργία απόδοσης. Για να γίνει αυτό, η έκδοση διαθέτει μια διόρθωση σφαλμάτων για getDerivedStatefromProps, το οποίο καλείται τώρα κάθε φορά που απαιτείται ένα στοιχείο ανεξάρτητα από το γιατί συμβαίνει η ενημέρωση. Είχε κληθεί μόνο εάν ένα στοιχείο εκδόθηκε από έναν γονέα και δεν θα πυροδοτούσε ως αποτέλεσμα ενός τοπικού setState. Η επιδιόρθωση δεν επηρεάζει τις περισσότερες εφαρμογές, αλλά, σε σπάνιες περιπτώσεις, θα μπορούσε να προκαλέσει προβλήματα με μικρό αριθμό στοιχείων.
  • Προστέθηκε ένα πειραματικό συστατικό προφίλ, που ονομάζεται unstable_Profiler, για τη μέτρηση της απόδοσης.
  • Ένας πειραματικός συνδυασμός, για τη δημιουργία προσαρμοσμένων αποδόσεων, διαθέτει ένα νέο σχήμα διαμόρφωσης κεντρικού υπολογιστή που είναι επίπεδο και δεν χρησιμοποιεί ένθετα αντικείμενα.
  • Οι διορθώσεις στο React DOM περιλαμβάνουν την επιδιόρθωση ενός σφάλματος που εμπόδισε τη διάδοση του περιβάλλοντος σε ορισμένες περιπτώσεις, καθώς και μια κατάσταση στην οποία ορισμένα χαρακτηριστικά αφαιρέθηκαν λανθασμένα από κόμβους προσαρμοσμένων στοιχείων.

Η πειραματική δυνατότητα επιστροφής κλήσεων διαγράφηκε στο React Version 16.4 επειδή επηρέασε το μέγεθος της δέσμης και το API δεν ήταν αρκετά καλό. Περιμένετε σε κάποια στιγμή σε άλλη μορφή, λέει το Facebook.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.3

Η έκδοση 16.3 του Μαρτίου 2018 του React φέρνει αλλαγές στον κύκλο ζωής καθώς και ένα API για το περιβάλλον.

Αλλαγές του κύκλου ζωής στο React 16.3

Για τον κύκλο ζωής των συστατικών, ο επερχόμενος τρόπος απόδοσης ασύγχρονης εκτείνεται στο μοντέλο API εξαρτήματος κλάσης, το οποίο χρησιμοποιείται με τρόπους που δεν είχαν αρχικά προβλεφθεί. Έτσι, προστίθενται νέοι κύκλοι ζωής, συμπεριλαμβανομένων getDerivedStateFromProps, ως ασφαλέστερη εναλλακτική λύση στον κληρονομικό κύκλο ζωής, componentWillReceiveProps. Προστέθηκε επίσης είναι σολetSnapshotBeforeUpdate, για την υποστήριξη της ασφαλούς ανάγνωσης των ιδιοτήτων, όπως το DOM πριν από την ενημέρωση.

Το React 16.3 προσθέτει επίσης το «μη ασφαλές» πρόθεμα σε μερικούς από αυτούς τους κύκλους ζωής, όπως componentWillMount και componentWillReceiveUpdate. Σε αυτές τις περιπτώσεις, το "μη ασφαλές" δεν αναφέρεται στην ασφάλεια αλλά στο γεγονός ότι ο κώδικας που χρησιμοποιεί αυτούς τους κύκλους ζωής είναι πιο πιθανό να έχει σφάλματα σε μελλοντικές εκδόσεις του React.

Με την έκδοση του React 16.3, οι προγραμματιστές δεν χρειάζεται να κάνουν τίποτα για τις παλαιότερες μεθόδους. Η κυκλοφορία έχει ως στόχο να παροτρύνει τους συντηρητές έργων ανοιχτού κώδικα να ενημερώσουν τις βιβλιοθήκες τους πριν από τις προειδοποιήσεις κατάργησης, οι οποίες δεν θα ενεργοποιηθούν μέχρι μελλοντική κυκλοφορία στη γραμμή 16.x.

Η έκδοση 16.3 προσθέτει το StrictMode στοιχείο, το οποίο προσδιορίζει στοιχεία με μη ασφαλείς κύκλους ζωής. StrictMode, η οποία εκτελείται μόνο σε λειτουργία ανάπτυξης, προειδοποιεί επίσης για τη χρήση API παλαιού τύπου συμβολοσειράς ref και ανιχνεύει απροσδόκητες παρενέργειες. Ενεργοποιεί επιπλέον ελέγχους για απογόνους. Περισσότερες λειτουργίες θα προστεθούν αργότερα.

Το API περιβάλλοντος υποστηρίζει έλεγχο στατικού τύπου και ενημερώσεις σε βάθος

Το νέο API περιβάλλοντος, υποστηρίζει έλεγχο στατικού τύπου και ενημερώσεις σε βάθος. Αυτό το API είναι επίσης πιο αποτελεσματικό από την προηγούμενη πειραματική έκδοση API, δήλωσε ο Brian Vaughn, μέλος της βασικής ομάδας React JS στο Facebook. Το περιεχόμενο επιτρέπει στα δεδομένα να περνούν μέσω ενός δέντρου συστατικών χωρίς να χρειάζεται να περάσουν χειροκίνητα στηρίγματα, μερικά από τα οποία περιλαμβάνουν προτίμηση τοπικών ρυθμίσεων και θέμα διεπαφής χρήστη. Το παλιό API θα συνεχίσει να λειτουργεί για τις εκδόσεις React 16.x, δίνοντας στους χρήστες χρόνο για μετεγκατάσταση.

Επίσης νέο στο React 16.3:

  • Ένα βελτιωμένο API, που ονομάζεται createrefAPI, για τη διαχείριση refs, που παρέχουν έναν τρόπο πρόσβασης σε κόμβους DOM ή στοιχεία React που αναπτύχθηκαν στη μέθοδο απόδοσης.
  • ο προς τα εμπρός API, βοηθώντας στη χρήση στοιχείων υψηλότερης τάξης που προωθούν την επαναχρησιμοποίηση κώδικα.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.2

Η κυκλοφορία του React 16.2 του Νοεμβρίου 2017 φέρνει την ικανότητα θραυσμάτων να βελτιώσει την υποστήριξη για την εμφάνιση πολλαπλών παιδιών από μια μέθοδο απόδοσης συστατικών. Τα θραύσματα, που μοιάζουν με κενές ετικέτες JSX, επιτρέπουν στους προγραμματιστές να ομαδοποιήσουν μια λίστα παιδιών χωρίς να προσθέσουν κόμβους στο DOM.

Μπορείτε να εγκαταστήσετε την Έκδοση 16.2 από το μητρώο NPM. Για εγκατάσταση με τον διαχειριστή πακέτων Νήματα, εκτελέστε νήματα add [email protected]^16.2.0 [email protected]^16.2.0. Για να το εγκαταστήσετε με NPM, εκτελέστε npm install --save [email protected]^16.2.0 [email protected]^16.2.0.

Προηγούμενη έκδοση: Νέες δυνατότητες στο React 16.0

Το React 16.0 το Σεπτέμβριο του 2017 ονομάστηκε "React Fiber" κατά τη διάρκεια της ανάπτυξής του. Τα βασικά χαρακτηριστικά του React 16 περιλαμβάνουν:

  • Σφάλματα που διαθέτουν ανίχνευση στοίβας στοιχείων για να διευκολύνουν τον εντοπισμό σφαλμάτων.
  • Επιστροφή συμβολοσειρών / συστοιχιών απευθείας από μεθόδους απόδοσης συστατικών.
  • Ένας νέος ταχύτερος, ροής απόδοσης διακομιστή.
  • Περισσότερη απόδοση εγγενών εφαρμογών.
  • Η μετάβαση από την αμφιλεγόμενη άδεια ευρεσιτεχνίας BSD + στην πιο εύγευστη άδεια MIT.

Αν και τα εσωτερικά της React έχουν ξαναγραφεί πλήρως στο React 16, το δημόσιο API είναι «ουσιαστικά αμετάβλητο», δήλωσε η Sophie Alpert, διευθύντρια μηχανικής του Facebook για το React. Η πρόθεση ήταν να σώσει τους προγραμματιστές από το να χρειαστεί να ξαναγράψουν υπάρχοντα στοιχεία που δημιουργήθηκαν με το React.

Ο νέος κώδικας του React 16 γράφτηκε παράλληλα με τον παλιό κώδικα στο GitHub repo, σύμφωνα με μια γνωστή πρακτική στο Facebook. Οι εναλλαγές μεταξύ των δύο έγιναν με το Boolean χρησιμοποιήστε το Fiber χαρακτηριστική σημαία. Η διαδικασία επιτρέπει στο Facebook να αρχίσει να δημιουργεί τη νέα του εφαρμογή χωρίς να επηρεάζει τους υπάρχοντες χρήστες και να συνεχίζει να κάνει διορθώσεις σφαλμάτων στην παλιά βάση κώδικα.

Μετά από λίγους μήνες από την εξάλειψη των σφαλμάτων, το Facebook επέλεξε να παραδώσει ένα μόνο προϊόν για να μειώσει το πιθανό σύνολο σφαλμάτων, αντί να διατηρήσει τις δύο εκδόσεις του React ενημερωμένες.