Απαξίωση Μπλοκ Gutenberg: Ενημέρωση Χωρίς Να Σπάσετε το Περιεχόμενο

Σύνοψη

Η ενημέρωση ενός μπλοκ Gutenberg συχνά σπάει υπάρχουσες αναρτήσεις που χρησιμοποιούν την παλιά έκδοση. Αυτό το άρθρο δείχνει πώς να χρησιμοποιήσετε την ιδιότητα deprecated στο block.json για να διατηρήσετε την οπισθοδρομική συμβατότητα. Θα μάθετε τα ακριβή βήματα για να καταγράψετε την τρέχουσα σήμανση του μπλοκ, να ορίσετε μία ή περισσότερες απαρχαιωμένες εκδόσεις και να αντιστοιχίσετε σωστά τα χαρακτηριστικά. Θα καλύψουμε τόσο στατικά όσο και δυναμικά μπλοκ, με πρακτικά παραδείγματα. Το άρθρο επίσης αμφισβητεί την υπόθεση ότι η απαξίωση είναι πάντα η καλύτερη προσέγγιση, συζητώντας πότε ένα καθαρό σπάσιμο μπορεί να είναι καλύτερο. Στο τέλος, θα είστε σε θέση να ενημερώνετε τα μπλοκ σας με σιγουριά χωρίς να σπάτε το περιεχόμενο των χρηστών σας.

Το Σενάριο Αλλαγής που Σπάει

Ξεκινήσατε ένα προσαρμοσμένο μπλοκ μαρτυρίας πριν από έξι μήνες. Εξάγει ένα απλό <div> με ένα απόσπασμα και ένα όνομα συγγραφέα. Τώρα ο πελάτης σας θέλει ένα νέο σχέδιο: ο συγγραφέας πρέπει να εμφανίζεται πάνω από το απόσπασμα, με μια διαφορετική κλάση CSS. Ενημερώνετε τη συνάρτηση save και το render_callback. Δοκιμάζετε σε μια νέα ανάρτηση—φαίνεται υπέροχο. Στη συνέχεια πλοηγείστε σε μια παλιά ανάρτηση που χρησιμοποιεί το μπλοκ. Καταστροφή: το κείμενο του αποσπάσματος έχει εξαφανιστεί, ο συγγραφέας είναι σε λάθος θέση και η μορφοποίηση είναι εκτός. Μόλις σπάσατε κάθε σελίδα που χρησιμοποιεί το μπλοκ.

Αυτό είναι το κλασικό πρόβλημα "αλλαγής που σπάει" στην ανάπτυξη μπλοκ Gutenberg. Τα μπλοκ είναι ουσιαστικά δομές δεδομένων συνδυασμένες με σήμανση. Όταν αλλάζετε τη σήμανση, ο επεξεργαστής δεν μπορεί να αντιστοιχίσει αυτόματα το παλιό περιεχόμενο στη νέα δομή. Το αποτέλεσμα είναι είτε ένα σφάλμα επικύρωσης (το μπλοκ γίνεται άκυρο) είτε—χειρότερα—σιωπηλή καταστροφή όπου το μπλοκ αποδίδεται λανθασμένα.

Τι Είναι η Απαξίωση Μπλοκ;

Η απαξίωση μπλοκ είναι ο ενσωματωμένος μηχανισμός του Gutenberg για τον χειρισμό αλλαγών έκδοσης. Ορίζοντας έναν πίνακα deprecated στο block.json του μπλοκ σας, λέτε στον επεξεργαστή: "Αν συναντήσετε ένα μπλοκ που ταιριάζει με μία από αυτές τις παλαιότερες εκδόσεις, μετατρέψτε το στην τρέχουσα έκδοση." Κάθε απαρχαιωμένη καταχώρηση καθορίζει τα προηγούμενα attributes, supports, και τη συνάρτηση save (ή render_callback). Όταν ο επεξεργαστής φορτώνει ένα παλιό μπλοκ, διατρέχει τον πίνακα deprecated με σειρά και εφαρμόζει τον πρώτο ταιριαστό μετασχηματισμό.

Αυτή η δυνατότητα συχνά υποχρησιμοποιείται επειδή οι προγραμματιστές υποθέτουν ότι δεν θα χρειαστεί ποτέ να αλλάξουν τη σήμανση ενός μπλοκ. Αλλά σε πραγματικά έργα, οι απαιτήσεις εξελίσσονται. Εάν παραλείψετε την απαξίωση, είτε αναγκάζετε τους χρήστες να διαγράψουν και να εισάγουν ξανά μπλοκ (κακή εμπειρία) είτε διατηρείτε δύο ξεχωριστές εκδόσεις του μπλοκ (ακατάστατο). Το επίσημο εγχειρίδιο προγραμματιστή WordPress καλύπτει αυτό στο Block Editor Handbook, αλλά λείπουν πρακτικές καθοδηγήσεις.

Βήμα 1: Καταγράψτε την Τρέχουσα Κατάσταση

Πριν κάνετε οποιεσδήποτε αλλαγές, καταγράψτε την ακριβή έξοδο save (ή render_callback για δυναμικά μπλοκ) και τα attributes που χρησιμοποιεί αυτήν τη στιγμή το μπλοκ σας. Σκεφτείτε το σαν να τραβάτε ένα στιγμιότυπο. Για στατικά μπλοκ, αποθηκεύστε το JSX που επιστρέφεται από τη συνάρτηση save. Για δυναμικά μπλοκ, αποθηκεύστε τη σήμανση PHP που δημιουργείται από το render_callback.

Δημιουργήστε ένα νέο αρχείο στο πρόσθετό σας με όνομα deprecated.js (ή παρόμοιο) και αποθηκεύστε εκεί την παλιά συνάρτηση save. Εναλλακτικά, κρατήστε τις απαρχαιωμένες εκδόσεις απευθείας στο κύριο αρχείο JavaScript του μπλοκ. Το κλειδί είναι να διατηρήσετε αυτόν τον κώδικα ακριβώς όπως ήταν όταν το μπλοκ αναπτύχθηκε για πρώτη φορά.

Βήμα 2: Ορίστε τις Απαρχαιωμένες Εκδόσεις

Στο block.json, προσθέστε έναν πίνακα deprecated. Κάθε καταχώρηση είναι ένα αντικείμενο που μπορεί να περιλαμβάνει:

• attributes (αντικείμενο): Οι προηγούμενοι ορισμοί χαρακτηριστικών.
• supports (αντικείμενο): Τυχόν προηγούμενες ρυθμίσεις υποστήριξης που άλλαξαν.
• save (συνάρτηση ή συμβολοσειρά): Η προηγούμενη συνάρτηση αποθήκευσης. Για μπλοκ μόνο JavaScript, θα εισαγάγετε την παλιά συνάρτηση. Για δυναμικά μπλοκ που αποδίδονται με PHP, μπορείτε να χρησιμοποιήσετε migrate και render_callback.
• migrate (συνάρτηση): Μια συνάρτηση που αντιστοιχίζει παλιά χαρακτηριστικά σε νέα (προαιρετικό).

Παράδειγμα:

"deprecated": [
  {
    "attributes": {
      "quote": { "type": "string", "source": "html", "selector": ".quote" },
      "author": { "type": "string", "source": "html", "selector": ".author" }
    },
    "supports": {},
    "save": "() => <div className=\"testimonial-legacy\"><p className=\"quote\">{attributes.quote}</p><p className=\"author\">{attributes.author}</p></div>"
  }
]

Σημείωση: Η συνάρτηση save στο block.json ορίζεται συνήθως σε JavaScript. Εάν χρησιμοποιείτε εξωτερικό σενάριο, θα χρειαστεί να το τοποθετήσετε στην ουρά και να αναφέρετε το όνομα της συνάρτησης. Εναλλακτικά, μπορείτε να ενσωματώσετε τη συνάρτηση ως συμβολοσειρά (αν και αυτό δεν συνιστάται για σύνθετα μπλοκ).

Βήμα 3: Αντιστοιχίστε Χαρακτηριστικά

Συχνά, αλλάζετε όχι μόνο τη σήμανση αλλά και τα ονόματα ή τις πηγές χαρακτηριστικών. Για παράδειγμα, μπορεί να αλλάξετε από την αποθήκευση του συγγραφέα ως απλής συμβολοσειράς σε ένα πεδίο εμπλουτισμένου κειμένου. Σε τέτοιες περιπτώσεις, χρησιμοποιήστε την ιδιότητα migrate για να μετατρέψετε τα παλιά χαρακτηριστικά σε νέα.

migrate: (attributes) => {
  return {
    quote: attributes.quote,
    author: { content: attributes.author, level: 2 }
  };
}

Εάν δεν παρέχετε συνάρτηση migrate, ο επεξεργαστής θα περάσει απλά τα παλιά χαρακτηριστικά απευθείας στο νέο μπλοκ. Αυτό μπορεί να προκαλέσει σφάλματα εάν άλλαξαν τα ονόματα χαρακτηριστικών.

Βήμα 4: Δοκιμάστε με Πραγματικό Περιεχόμενο

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

Για δυναμικά μπλοκ, η διαδικασία είναι παρόμοια αλλά με μια διαφοροποίηση: η συνάρτηση save για ένα δυναμικό μπλοκ επιστρέφει συνήθως null (το μπλοκ αποδίδεται μέσω PHP). Στην απαρχαιωμένη καταχώρηση, μπορείτε είτε να ορίσετε το save στην προηγούμενη στατική σήμανση που χρησιμοποιήθηκε πριν μεταβείτε σε δυναμική απόδοση, είτε να χρησιμοποιήσετε ένα render_callback σε PHP που χειρίζεται τόσο παλιές όσο και νέες δομές χαρακτηριστικών. Αυτό είναι πιο περίπλοκο αλλά εφικτό.

Προειδοποιήσεις και Αντισταθμίσεις

Η απαξίωση είναι ισχυρή, αλλά έχει μειονεκτήματα. Κάθε απαρχαιωμένη έκδοση προσθέτει κώδικα στο πρόσθετό σας. Με τον καιρό, μπορεί να καταλήξετε με μια αλυσίδα πέντε ή έξι κληρονομημένων εκδόσεων που σπάνια χρησιμοποιούνται αλλά πρέπει να συντηρούνται. Η βασική ομάδα του WordPress συνιστά να διατηρείτε τουλάχιστον δύο εκδόσεις πίσω, αλλά πέρα από αυτό, μπορείτε να εξετάσετε ένα καθαρό σπάσιμο αν ο αριθμός των επηρεαζόμενων αναρτήσεων είναι μικρός.

Μια άλλη απόχρωση: η σειρά των απαρχαιωμένων καταχωρήσεων έχει σημασία. Ο επεξεργαστής επαναλαμβάνει τον πίνακα από το ευρετήριο 0 και χρησιμοποιεί την πρώτη αντιστοιχία. Αν δύο απαρχαιωμένες εκδόσεις είναι παρόμοιες, μπορεί να εφαρμοστεί η λάθος. Πάντα να καταχωρείτε πρώτα την πιο πρόσφατη απαρχαιωμένη έκδοση (αυτή που προηγείται άμεσα της τρέχουσας έκδοσης).

Τέλος, η απαξίωση δεν χειρίζεται περιεχόμενο που επεξεργάστηκε χρησιμοποιώντας μια αλλαγή στυλ σε ολόκληρο τον ιστότοπο (π.χ., μέσω theme.json). Εάν η εμφάνιση του μπλοκ σας βασιζόταν σε καθολικά στυλ που έχουν έκτοτε αλλάξει, η απαξίωση δεν θα το προσαρμόσει. Μπορεί να χρειαστεί να προσθέσετε ένα σενάριο μετεγκατάστασης που εκτελείται κατά την αποθήκευση ή μέσω ενός hook ενημέρωσης πρόσθετου.

Πότε η Απαξίωση Δεν Είναι η Απάντηση

Τα περισσότερα σεμινάρια παρουσιάζουν την απαξίωση ως υποχρεωτική. Στην πραγματικότητα, υπάρχουν καταστάσεις όπου ένα καθαρό σπάσιμο είναι καλύτερο. Εάν το μπλοκ σας είναι νέο και χρησιμοποιείται μόνο σε λίγες αναρτήσεις, η μη αυτόματη ενημέρωση αυτών των λίγων περιπτώσεων μπορεί να είναι ταχύτερη από τη σύνταξη και δοκιμή κώδικα απαξίωσης. Ομοίως, εάν το υποκείμενο μοντέλο δεδομένων του μπλοκ είναι θεμελιωδώς διαφορετικό (π.χ., συγχωνεύετε δύο μπλοκ σε ένα), η απαξίωση μπορεί να μην είναι αρκετά ευέλικτη. Σε αυτήν την περίπτωση, γράψτε ένα σενάριο μετεγκατάστασης μιας χρήσης που εκτελείται όταν το πρόσθετο ενημερώνεται, μετατρέποντας τα παλιά μπλοκ στη νέα μορφή.

Ένα άλλο αντιθετικό σημείο: η απαξίωση δεν πρέπει να χρησιμοποιείται ως υποκατάστατο καλού σχεδιασμού. Εάν προβλέπετε συχνές αλλαγές, σχεδιάστε το μπλοκ σας με έκδοση από την αρχή—π.χ., αποθηκεύοντας ένα χαρακτηριστικό version και χρησιμοποιώντας υπό όρους απόδοση. Αυτή η προσέγγιση, που συζητείται στο Beyond Basic Blocks, είναι ελαφρύτερη από την απαξίωση αλλά απαιτεί προβλεπτικότητα.

Συμπέρασμα

Η απαξίωση μπλοκ είναι ένα απαραίτητο εργαλείο για κάθε σοβαρό προγραμματιστή Gutenberg. Σας επιτρέπει να εξελίσσετε τα μπλοκ σας χωρίς να σπάτε το περιεχόμενο των χρηστών. Τα βασικά βήματα είναι: καταγράψτε την τρέχουσα κατάσταση, ορίστε την απαρχαιωμένη έκδοση στο block.json, αντιστοιχίστε χαρακτηριστικά αν χρειάζεται και δοκιμάστε με πραγματικό περιεχόμενο. Αλλά θυμηθείτε ότι η απαξίωση συνεπάγεται κόστος συντήρησης. Μερικές φορές ένα καθαρό σπάσιμο ή ένα μπλοκ με έκδοση είναι πιο πρακτικό. Χρησιμοποιήστε την απαξίωση στρατηγικά, όχι αυτόματα, και τα μπλοκ σας θα παραμείνουν ανθεκτικά μέσα από πολλές ενημερώσεις.

Για μια ευρύτερη προοπτική στην κατασκευή συντηρήσιμων προσθέτων, δείτε το Building Robust WordPress Plugins. Και αν είστε νέοι στην ανάπτυξη μπλοκ, το Beyond Basic Blocks θα σας βοηθήσει να ξεκινήσετε.