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

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

1) D3.js

01-d3js-οπτικοποίηση-βιβλιοθήκη

Τα μεγάλα δεδομένα είναι μια αναπτυσσόμενη βιομηχανία και οπτικοποίηση δεδομένων γρήγορα γίνεται εξίσου σημαντική. Υπάρχουν τόνοι χαρτογράφησης και χαρτογράφησης βιβλιοθηκών, αλλά λίγοι ξεχωρίζουν όσο D3.js . Αυτή η βιβλιοθήκη JS συνεργάζεται με στοιχεία SVG και καμβά για την απόδοση γραφημάτων, διαγραμμάτων και δυναμικών απεικονίσεων στον ιστό.

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

2) Node.js

02-nodejs-λογότυπο

Ξέρω ότι πολλοί devs είναι άρρωστοι για ακρόαση Κόμβος όλη την ώρα. Αλλά είναι πραγματικά η ταχύτερα αναπτυσσόμενη βιβλιοθήκη JS και προσφέρει πολύ περισσότερα από ένα περιβάλλον dev. Με το NPM μπορείτε να διαχειριστείτε τοπικά πακέτα για όλα τα έργα σας απευθείας από τη γραμμή εντολών.

Αυτό καθιστά τον κόμβο ένα πλήρες εργαλείο ανάπτυξης που λειτουργεί καλά με άλλα εργαλεία όπως το Gulp. Επιπλέον, δεκάδες σχετιζόμενα έργα ανοιχτού κώδικα έχουν δημιουργηθεί στον κόμβο, ώστε να μπορείτε να εργαστείτε με τη δοκιμή μονάδων μέσα Mocha.js ή να δημιουργήσετε μια διεπαφή εμπρός με το Sails.js δομή.

Αν δεν έχετε δοκιμάσει ακόμα τον κόμβο, ίσως να εκπλαγείτε πόσο λείπει.

3) Riot.js

Οθόνη 03-riotjs

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

Αλλά Riot.js θέτει μια σταθερή πάλη προσφέροντας μια ωραία εναλλακτική λύση στο React. Χρησιμοποιώντας το πλαίσιο Riot έχετε ακόμα πρόσβαση σε ένα εικονικό DOM, αλλά είναι πολύ πιο εύκολο να τον ελέγξετε με απλούστερες απαιτήσεις σύνταξης. Δυστυχώς αυτή η βιβλιοθήκη δεν είναι τόσο μεγάλη όσο η React και δεν τροφοδοτείται από το Facebook, οπότε δεν θα έχετε την τεράστια κοινότητα. Αλλά είναι μια υγιεινή εναλλακτική λύση και είναι ένας αξιοπρεπής ανταγωνιστής στο χώρο του μπροστινού άκρου.

4) Create.js

04-createjs-easel-js-οθόνη

Από το web animation σε ψηφιακά μέσα μπορείτε να εργαστείτε με τα πάντα μέσα CreateJS . Δεν πρόκειται για μια ενιαία βιβλιοθήκη, αλλά μια σουίτα βιβλιοθηκών για διαφορετικούς σκοπούς. Για παράδειγμα, το Easel.js λειτουργεί με στοιχεία καμβά HTML5, ενώ το Tweet.js σας βοηθά να δημιουργήσετε custom tweening & animations για τον ιστό.

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

5) Keystone.js

05-keystone-js-cms

Νωρίτερα ανέφερα το Node.js και πόσες άλλες βιβλιοθήκες είναι χτισμένες πάνω από αυτό. Keystone.js είναι ένα φανταστικό παράδειγμα που ξεπερνά τον Κόμβο προσφέροντας έναν πλήρη CMS κινητήρα.

Με το Keystone μπορείτε να χτίσετε MEAN webapps powered by Node / Express και MongoDB στο backend. Το Keystone.js είναι εντελώς δωρεάν αλλά ακόμα και καινούργιο. Κατά τη διάρκεια αυτής της γραφής είναι μόνο στο v0.3 έτσι έχει πολύ δρόμο για επαγγελματική χρήση.

Αλλά αν είστε παγιδευμένοι από ένα καθαρό CMS JavaScript, τότε ελέγξτε το και δείτε τι σκέφτεστε.

6) Vue.js

06-vuejs-λογότυπο

Στον κόσμο των πλαισίων του μπροστινού άκρου, υπάρχουν συνήθως δύο επιλογές: Γωνιακές και άκρες. Αλλά Vue.js είναι μια άλλη πολύ δημοφιλής επιλογή και κερδίζει γρήγορα περισσότερη προσοχή από τότε v2.0 έκδοση .

Το Vue είναι ένα πλαίσιο MVVM frontend JavaScript, ώστε να απομακρύνεται από την τυπική αρχιτεκτονική MVC. Είναι δύσκολο να μάθουν, αλλά η σύνταξη είναι απλή όταν καταλάβετε πώς όλα λειτουργούν. Είναι σίγουρα μια βιώσιμη επιλογή στον πόλεμο των πλαισίων μπροστά και αξίζει να το παρακολουθούμε προσεκτικά τα επόμενα χρόνια.

7) Meteor

07-meteor-js-logo

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

Υπάρχει ακόμα και ένα πλαίσιο κοινωνικών ειδήσεων που ονομάζεται Τηλεσκόπιο χτισμένο στην κορυφή του Meteor. Αυτό σας επιτρέπει να δημιουργήσετε έναν ιστότοπο κοινωνικών ειδήσεων / κοινωνικής ψηφοφορίας από την αρχή στο Meteor and React.

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

8) Chart.js

08-chartjs-canvas-demo

Με Chart.js μπορείτε να δημιουργήσετε διαγράμματα γραμμών, διαγράμματα γραμμών, διαγράμματα φυσαλίδων και πολλά άλλα παρόμοια χαρακτηριστικά χρησιμοποιώντας το JavaScript και το API καμβά. Αυτή είναι μία από τις απλούστερες βιβλιοθήκες JS για διαγράμματα δεδομένων και έρχεται με ενσωματωμένες επιλογές για κινούμενα σχέδια.

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

9) WebVR

09-webvr-logo

Φαίνεται ότι η εικονική πραγματικότητα έχει πάρει τον κόσμο από τη θύελλα με νέες επιχειρήσεις και ενθουσιασμένους προγραμματιστές που εργάζονται ακούραστα σε έργα VR. Γι 'αυτό δεν ήμουν έκπληκτος να βρω WebVR , ένα νέο API JavaScript που δημιουργήθηκε για το VR στο πρόγραμμα περιήγησής σας.

Αυτό λειτουργεί από τις πιο δημοφιλείς συσκευές όπως το Oculus Rift και το Vive, αλλά αυτή τη στιγμή βρίσκεται σε φάση ανάπτυξης. Το API είναι ανοικτού κώδικα και δοκιμάζεται συνεχώς με τα σύγχρονα προγράμματα περιήγησης για να μετρήσει τον τρόπο λειτουργίας του σε συσκευές VR.

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

10) Three.js

10-threejs-3d-γραφικά-webgl

Είναι τρελό να δούμε πόσο 3D animation έχει μεγαλώσει από τη δεκαετία του 1980 μέχρι σήμερα. Όλοι γνωρίζουμε ταινίες 3D με κίνηση, αλλά η διαδικτυακή ζωτικότητα είναι ακόμα ένα νέο σύνορο. Και ευτυχώς έχουμε βιβλιοθήκες όπως Three.js βλάπτοντας μια διαδρομή για 3D κίνηση στο διαδίκτυο.

Στην κεντρική σελίδα θα βρείτε δεκάδες ζωντανά παραδείγματα του Three.js σε δράση. Μπορείτε να δημιουργήσετε φόντα ευαίσθητα στην κίνηση, προσαρμοσμένα 3D γραφικά ιστού και δυναμικά στοιχεία διεπαφής που χρησιμοποιούν εφέ κίνησης 3D. Εάν έχετε αρκετή υπομονή και οδηγείτε, μπορείτε να δημιουργήσετε οποιοδήποτε 3D εφέ με αυτήν τη βιβλιοθήκη. Είναι ο καλύτερος πόρος για 3D κίνηση στον ιστό, και έρχεται με πολλά παραδείγματα για να ξεκινήσετε.

11) Omniscient.js

Βιβλιοθήκη 11-omniscient-js

Ο λειτουργικός προγραμματισμός με JavaScript δεν είναι κάτι καινούργιο. Αλλά είναι αρκετά νέο στο διαδίκτυο και είναι πλέον πολύ συνηθισμένο με τις βιβλιοθήκες όπως Omniscient.js . Αυτή η ελεύθερη βιβλιοθήκη ανοιχτού κώδικα χειρίζεται τις προβολές με μια διαδικασία απόδοσης από την κορυφή προς τα κάτω για όλα τα στοιχεία του μπροστινού τμήματος. Μπορείτε να γράψετε λειτουργικό JS κώδικα από το μηδέν και να εργαστείτε με τις υπάρχουσες βιβλιοθήκες UI όπως το React.

Θα ήθελα να συστήσω ειδικά αυτή τη βιβλιοθήκη σε κάθε έμπειρο προγραμματιστή που θέλει μια ομαλότερη διαδικασία ανάπτυξης. Είναι ένα περίπλοκο θέμα για αρχάριους αλλά το Omniscient μπορεί να αλλάξει ριζικά τη δουλειά σας dev όταν χρησιμοποιείται σε συντονισμό με τα εξαρτήματα React.

12) Ractive.js

12-rative-js-demo

Αν ψάχνετε για μια βιβλιοθήκη UI που είναι διαφορετική από την υπόλοιπη νομίζω Ractive.js ταιριάζει καλά στο καλούπι. Έρχεται με αμφίδρομη δέσμευση για στοιχεία προτύπου και δεδομένα, ώστε να μπορείτε να δημιουργήσετε πρότυπα με στοιχεία που δεσμεύουν τις λειτουργίες Ract στο JavaScript.

Αυτή είναι μια αρκετά πυκνή βιβλιοθήκη, αλλά προσφέρει μια από τις πιο ομαλές καμπύλες μάθησης για αρχάριους. Δεν είναι τόσο λεπτομερές όσο το React, και χρησιμοποιεί πολύ διαφορετική σύνταξη σε JS και HTML. Επισκέψου το κύρια τοποθεσία για να μάθετε περισσότερα και δείτε το σελίδα παραδειγμάτων για να δούμε τι είναι δυνατό με το Ract.

Όλες οι βιβλιοθήκες σε αυτή τη θέση έχουν κάτι μοναδικό για να προσφέρουν την κοινότητα JS. Αν σας αρέσει να τσακίσετε με το JavaScript, κάντε μια άλλη ματιά πάνω από κάθε βιβλιοθήκη εδώ και δείτε τι μπορούν να προσφέρουν τα έργα σας web dev.