Γιατί τα Web Components Αλλάζουν το Παιχνίδι στα Design Systems

Τα design systems έχουν γίνει πια βασικό εργαλείο για κάθε ομάδα ανάπτυξης. Ένα κοινό σημείο αναφοράς για το σχεδιασμό, τα στοιχεία και τις πρακτικές που χρησιμοποιούνται. Όμως, στην πορεία, υπήρξε ένα λάθος που κόστισε: χτίσαμε τα συστήματα αυτά μέσα σε συγκεκριμένα frameworks.

Κάπως έτσι, εργαλεία που υποτίθεται πως θα ήταν ευέλικτα και φορητά, κατέληξαν να λειτουργούν μόνο σε React, Vue ή Angular. Είναι σαν να φτιάχνεις έναν φορτιστή για όλες τις συσκευές και μετά να τον κολλάς μόνιμα σε ένα μόνο κινητό.

Η Παράδοξη Πλευρά των Design Systems

Η ιδέα των design systems ήρθε φυσικά, για να λύσει πραγματικά προβλήματα: ανάγκη για συνέπεια, καλύτερη τεκμηρίωση και επαναχρησιμοποίηση στοιχείων. Αλλά το πώς τα υλοποιήσαμε δεν συμβάδιζε με το σκοπό. Τα περισσότερα συστήματα έγιναν βιβλιοθήκες που δούλευαν μόνο σε συγκεκριμένο framework.

Αν είστησες σε React, μπορούσες να χρησιμοποιήσεις το design system. Αν όχι, έπρεπε να χτίσεις τα πάντα από το μηδέν. Αυτό είναι όχι design system, αλλά μια απλή βιβλιοθήκη για ένα framework.

Το πραγματικό πρόβλημα είναι ότι τα web standards έχουν πλέον αρκετό δυναμικό να αποφύγουν αυτό το δilemma. Web components, με βάση τον custom elements και το shadow DOM, προσφέρουν μια πιο ουδέτερη και διαχρονική προσέγγιση.

Τα Web Components σε Πράξεις

Web components δεν είναι trendy. Ούτε θα βγουν στην κορυά του σχεδίου. Τόφι δεν είναι, αλλά έχουν πραγματικότερο πρακτικός πνεύμα.

Δεν Εξαρτώνται από Framework: Επίραξαν σε κάθε framework. React, Vue, Angular ή Svelte – όλα υποστηρίζουν web components, είτε με φυσικό τρόπο είτε με μικρή προσωπταρμογή. Αυτό bedeutet ότι τα συμπέρασματα δεν είναι δεμένα μόνο σε ένα σύστημα.

Εργάζονται με τα Web Standards: Με το ανάπτυξη σε web components, κάνουν με το platform. No abstraction layers. No framework-specific magic. Απλά HTML, CSS και JavaScript που θα λειτουργούν ακόμα και μετά από πέντε χρόνια.

Πραγματική Φορητότητα: Ένα button είναι ένα button. Όχι ένα React button ή ένα Vue button. Εμπειρία της χρήσης και της εσωτερική της διαstatment δεν διαintη σε κάθε περιβάλλον. Web components κάνουν αυτό το Ziel πραγματικό.

Η Mental Shift: Less is More

Το φνσ διάmelta με web components απώθει μια εν<|eos|>