Σπίτι > iOS > H Γράφουμε μια απλή μηχανή προτύπων σε js σε προσχέδια εκμάθησης. H Γράψιμο μιας απλής μηχανής προτύπων js σε πρόχειρα Οδηγός Δημιουργία εκτελέσιμου κώδικα


H Γράφουμε μια απλή μηχανή προτύπων σε js σε προσχέδια εκμάθησης. H Γράψιμο μιας απλής μηχανής προτύπων js σε πρόχειρα Οδηγός Δημιουργία εκτελέσιμου κώδικα





Τώρα βλέπω μόνο δύο επιλογές για πρότυπα σε εφαρμογές js, μηχανές προτύπων που είναι ενσωματωμένες στο πλαίσιο και jquery noodles (το τελευταίο είναι το πιο συνηθισμένο). Πιστεύω ότι αυτό οφείλεται στο γεγονός ότι πολλοί δεν καταλαβαίνουν πώς λειτουργούν οι μηχανές προτύπων γενικά (μιλάω για τα εσωτερικά τους, όχι για τις λειτουργίες τους) .
Σε αυτό το άρθρο θα σας δείξω πώς να φτιάξετε μια απλή αλλά ισχυρή μηχανή προτύπων βασισμένη σε κανονικές εκφράσεις.

Για όσους όμως δεν το γνωρίζουν, λίγα λόγια για το τι είναι και τι θα μας δώσει.

Η μηχανή προτύπων (στον Ιστό) είναι λογισμικό που σας επιτρέπει να χρησιμοποιείτε πρότυπα HTML για τη δημιουργία τελικών σελίδων HTML. Ο κύριος σκοπός της χρήσης μηχανών προτύπων είναι ο διαχωρισμός της παρουσίασης δεδομένων από τον εκτελέσιμο κώδικα. Αυτό είναι συχνά απαραίτητο για να εξασφαλιστεί η παράλληλη εργασία ενός προγραμματιστή και ενός σχεδιαστή διάταξης. Η χρήση μηχανών προτύπων συχνά βελτιώνει την αναγνωσιμότητα του κώδικα και αλλάζει την εμφάνιση όταν το έργο χειρίζεται εξ ολοκλήρου ένα άτομο.

Και έτσι θέλουμε να αποδώσουμε πρότυπα σε 1 πέρασμα και να έχουμε μια παρουσίαση ξεχωριστή από τη λογική. Συνήθως οι μηχανές προτύπων έχουν παρόμοια διεπαφή.
template.Run("template url", ( VarName:"VarValue" ));
Παρακάτω είναι ο κώδικας με αναλυτικά σχόλια (τι και γιατί)
window.template = ( //φορτώνει την προβολή TemplateGet: συνάρτηση (TemplateUrl) ( // 1. Δημιουργήστε ένα νέο αντικείμενο XMLHttpRequest var xhr = νέο XMLHttpRequest(); // 2. Διαμόρφωση: GET αίτημα στη διεύθυνση URL "TemplateUrl" xhr .open ("GET", TemplateUrl, false); // 3. Στείλτε το αίτημα xhr.send(); if (xhr.status >= 200 && xhr.status< 400) { // вернуть результат return xhr.responseText; } else { // обработать ошибку alert(xhr.status + ": " + xhr.statusText); // пример вывода: 404: Not Found return ""; } }, //класс функций для рендинга Render:{ //а в этом классе мы напишем все функции рендера func:{ //рендит переменные vars: function(html, vars){ //ищем все переменные в шаблоне var $ = html.match(/{{var.(.*?)}}/g); //проверяем нашли ли что то if (Array.isArray($)) { //мы нашли переменные в шаблоне. Необходимо их все распарсить. $.forEach(function (item) { //item содержит найденую строку {{var.VarName}} //по этому мы должны распарсить ету строку дабы получить только VarName item = item.replace("{{var.", ""); item = item.replace("}}", ""); //у нас есть имя переменной. Пора проверить передали ли мы такую //и обработать ошибки if (vars === undefined){ //перенную не передали. //пишем об ошибке в консоль и заменяем её значение в шаблоне на null console.warn("Переменная "+item+" не найдена"); html = html.replace("{{var." + item + "}}", "null"); } else { //переменную мы нашли. Вставим ка её в шаблон html = html.replace("{{var." + item + "}}", vars); } }); } //удалим обьект с переменными delete vars; //вернём html return html; } }, //точка входа в рендер. Run:function(html, vars){ html = this.func.vars(html, vars); return html; } }, //точка входа Run: function (TemplateUrl, vars) { //загружаем шаблон var html = this.TemplateGet(TemplateUrl); //отправляем шаблон рендеру html = this.Render.Run(html, vars); //удаляем обьект с переменными. Он нам больше не нужен, а может занимать много места delete vars; //результат шаблонизатор вставит в document.getElementById("page").innerHTML = html; } }; //вызовем представление template.Run("test.tpl", { VarName: "test" });
Και στο test.tpl απλώς θα γράψουμε
((var.VarName))

Ελπίζω τώρα να υπάρχουν λιγότερα jquery noodles)

Υπάρχουν αρκετές περιπτώσεις που μπορεί να χρειαστείτε μια μηχανή προτύπων JavaScript, συμπεριλαμβανομένης της ανάγκης δημιουργίας περιεχομένου στον πελάτη και στον διακομιστή, εάν χρησιμοποιείτε πλαίσια JavaScript όπως το NodeJS ή το Rhino. Θα πω αμέσως ότι θεώρησα πολλές υπάρχουσες μηχανές προτύπων για τον εαυτό μου, από απλές έως εξωτικές. Πάνω από όλα με ενδιέφεραν τα απλά, αλλά επιτρέποντας τη χρήση σύνθετης λογικής σε πρότυπα, και το EJS αποδείχθηκε ότι ήταν ένα από αυτά. Ωστόσο, αυτό το πράγμα γράφτηκε κάπως διαφορετικά απ' ό,τι θα ήθελα· από τη μια, υπήρχαν πολλά περιττά πράγματα, από την άλλη, η κύρια λειτουργικότητα ήταν πολύ περίπλοκη. Είδα μια ευκαιρία να κάνω τη μεταγλώττιση και την απόδοση των προτύπων του πολύ πιο εύκολη.

Εφαρμογή EJS

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

Με το EJS, η ιδέα είναι απλή: ως μέρος ενός προτύπου, μπορούμε να συνδυάσουμε ως έχει περιεχόμενο με κομμάτια ενσωματωμένης JavaScript, παρόμοια με το πώς τα αρχεία σεναρίων PHP συνδυάζουν την HTML με τον κώδικα. Ο κώδικας δείχνει τόσο τις καθολικές μεταβλητές όσο και αυτές που θα φροντίσουμε να περάσουμε στον renderer όταν καλείται. Μπορείτε επίσης να δείτε τις λεγόμενες βοηθητικές λειτουργίες που απλοποιούν το σχηματισμό δομών που χρησιμοποιούνται συχνά, για παράδειγμα, ετικέτες συνδέσμων ή εικόνες.

Ο κώδικας πλαισιώνεται σε μια ετικέτα ή ετικέτα.

Δείτε πώς μπορεί να μοιάζει:

Έγραψα σκόπιμα τις κατασκευές σε διαφορετικά στυλ για να δείξω ότι η παρουσία των χώρων δεν έχει σημασία. Κατά τη δημιουργία εξόδου χρησιμοποιώντας ένα πρότυπο, περνάμε ένα αντικείμενο με ιδιότητες που λειτουργούν ως μεταβλητές στις οποίες λειτουργεί ο κώδικας μέσα στο πρότυπό μας. Το θέμα είναι ότι με τη βοήθεια λογικών δομών στην ίδια τη JavaScript, μπορείτε να αλλάξετε ευέλικτα τον τύπο του περιεχομένου που δημιουργείται ως αποτέλεσμα. Προαιρετικά, είναι δυνατό να χρησιμοποιηθούν ετικέτες όπως [% %], εάν το πρότυπο υποτίθεται ότι θα αποδοθεί αφού συμπεριληφθεί στο δέντρο DOM. Υπό το φως των μοτίβων χρήσης μου, δεν το βρήκα πολύ χρήσιμο.

Βελτίωση EJS

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

Ανάλυση προτύπων πηγών

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

/(?:\n\s*)?(])+)%>/gm

Τι κάνουμε λοιπόν εδώ:

  • (?:\n\s*)? - αφαιρέστε τη αλλαγή γραμμής και όλα τα κενά από αυτήν στην ετικέτα κωδικού, εάν υπάρχουν. Αυτό, φυσικά, δεν ήταν καθόλου απαραίτητο να γίνει, αλλά είμαστε αισθητιστές, επομένως θα αποτρέψουμε την εμφάνιση πολλών κενών γραμμών στο περιεχόμενο που δημιουργείται. Ο προσδιοριστής ?: στην αρχή ενός υπομοτίβου σημαίνει ότι τα περιεχόμενά του δεν καταγράφονται αλλά απλώς παραλείπονται.
  • (] - ο κώδικάς μας είναι οποιοιδήποτε χαρακτήρες δεν είναι % , ή ένας χαρακτήρας % που δεν ακολουθείται από χαρακτήρα >.
  • (?:[^%]|[%][^>])+ είναι ο κώδικάς μας - αυτές οι ακολουθίες μπορούν να υπάρχουν περισσότερες από μία φορές, αλλά δεν πρέπει να καταγράφονται.
  • ((?:[^%]|[%][^>])+) είναι ο κώδικάς μας - και καταγράφουμε ολόκληρη την ακολουθία.
  • %> - η ετικέτα κλεισίματος δεν καταγράφεται.
  • gm - ενεργοποιήστε την καθολική επεξεργασία πλήρους κειμένου (πολλαπλών γραμμών).

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

Δημιουργία εκτελέσιμου κώδικα

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

Ας το οργανώσουμε με τον ακόλουθο απλό τρόπο:

  • θα σχηματίσουμε τη συνάρτηση ως συμβολοσειρά κατάλληλη για κλήση eval
  • στο σώμα της συνάρτησης οργανώνουμε τη διαδοχική προσάρτηση κομματιών περιεχομένου σε μια συγκεκριμένη μεταβλητή αποτελέσματος
  • θα επικολλήσουμε τον κανονικό κώδικα JS ως έχει

Ωστόσο, θα χρειαστεί να λύσουμε τα ακόλουθα προβλήματα:

  • μεταβίβαση μεταβλητών και βοηθητικών συναρτήσεων στο σώμα της εκτελέσιμης συνάρτησης προτύπου
  • οργάνωση της μεταβλητής αποτελέσματος έτσι ώστε να μην παρεμβαίνει στις μεταβλητές που χρησιμοποιούνται στο πρότυπο
Επίλυση του πρώτου προβλήματος

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

Var obj = ( foo: "It is foo.", bar: 42 ); with(obj)( foo += "And bar is" + bar; )

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

Επίλυση του δεύτερου προβλήματος

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

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

Χαρακτηριστικά Υλοποίησης

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

Ήρθε η ώρα να πάμε απευθείας στον κώδικα, ας δούμε τα πάντα σε μέρη, ξεκινώντας από το κύριο και κύριο πράγμα, δηλαδή το αντικείμενο προτύπου:

// Κατασκευαστής var EJS = συνάρτηση(src)( if(typeof src == "string")( // Αν περάσει ένα πρότυπο this.compile(src); // Μεταγλωττίστε το αμέσως ) ); // EJS prototype.prototype = ( regexp: /(?:\n\s*)?(])+)%>/gm, helper: () // Helper functions );

EJS.prototype.compile = function(src)( delete this.method; delete this.error; // διαγραφή ιχνών της προηγούμενης κλήσης μεταγλωττιστή var p = src.split(this.regexp), // Αποτέλεσμα ανάλυσης r = , // Συναρμολογήσεις αποτελεσμάτων i, o; this.parsed = p; // Αμέσως αποθήκευση του αποτελέσματος ανάλυσης // Συγκεντρώνουμε τη συνάρτηση δημιουργίας περιεχομένου για(i = 0; i< p.length; i++){ if(p[i] == " 0) { str += parts[ len ]; } } return str; }

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

Αλλά ο στόχος μου ήταν να δείξω την ίδια την ιδέα...

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

Ελπίζω να είναι χρήσιμο σε κάποιον.
Σας ευχαριστώ για την προσοχή σας!

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

Το ICanHaz.js είναι μια αρκετά απλή και ελαφριά βιβλιοθήκη για εργασία με πρότυπα Mustache. Με αυτό, μπορείτε να ορίσετε τμήματα προτύπου σε ετικέτες σεναρίου με type=”text/html” και να τα καλέσετε μέσω id, με επικύρωση.

Το Mustache.js είναι μια πολύ δημοφιλής μηχανή προτύπων σε αυτήν την περιοχή εφαρμογής. Παρέχει λύσεις από την πλευρά του διακομιστή και του πελάτη, ώστε να μην χρειάζεται να ανησυχείτε για τη χρήση πολλών κινητήρων προτύπων. Διαθέτει καλή και ξεκάθαρη τεκμηρίωση, καθώς και μεγάλη κοινότητα. Τα πρότυπα χρησιμοποιούν μορφή δεδομένων JSON. Λειτουργεί εξαιρετικά σε δημοφιλείς γλώσσες προγραμματισμού. Μπορείτε να κατεβάσετε την πιο πρόσφατη έκδοση της βιβλιοθήκης από την επίσημη σελίδα.

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

Το Underscore.js είναι ένα βολικό και πρακτικό εργαλείο για την εργασία με το jQuery. Διαθέτει περισσότερα από 60 λειτουργικά βοηθητικά προγράμματα. Αυτή η μηχανή προτύπων βελτιώνει τη λειτουργικότητα του jQuery όταν εργάζεστε με πίνακες, συναρτήσεις, αντικείμενα, συλλογές κ.λπ. 5 jQuery UI εναλλακτικές.

Το Hogan.js είναι μια μηχανή προτύπων που αναπτύχθηκε από το Twitter. Χρησιμοποιείται ως δημιουργός ενδιάμεσων προτύπων για τη γρήγορη δυναμική επεξεργασία τους από ένα πρόγραμμα περιήγησης ιστού. Η ανάπτυξη αυτής της μηχανής προτύπων βασίστηκε στο Mustache, αλλά το Hogan.js είναι πολύ πιο γρήγορο. Προσφέρεται ένα API για πρόσβαση στις συναρτήσεις ανάλυσης. Η σάρωση και η ανάλυση προτύπων εκτελούνται με ξεχωριστές μεθόδους, ως αποτέλεσμα των οποίων τα πρότυπα μπορούν να υποβληθούν σε επεξεργασία εκ των προτέρων στον διακομιστή και να χρησιμοποιηθούν σε μορφή Javascript στην πλευρά του πελάτη.

– χρησιμοποιείται για εργασία με πρότυπα διακομιστών, αλλά γενικά ισχύει για άλλους σκοπούς. Έχει υψηλή αναγνωσιμότητα κώδικα και καλή ασφάλεια. Λειτουργεί από το τμήμα πελάτη· είναι δυνατό να χρησιμοποιηθεί το βοηθητικό πρόγραμμα για τη μεταγλώττιση προτύπων HTML από τη γραμμή εντολών. Η μηχανή προτύπων έχει μετονομαστεί σε Pug.js, αλλά με το παλιό όνομα μπορείτε να βρείτε μεγάλο όγκο τεκμηρίωσης και χρήσιμες πληροφορίες για τον προγραμματιστή.

Η μηχανή προτύπου ECT έχει σχεδιαστεί για να βελτιώνει την ταχύτητα. Βασίζεται στη μηχανή προτύπων Coffeescript. Έχει καλή συμβατότητα με το Node.js και αρκετά απλή σύνταξη. Μπορείτε επίσης να ελέγξετε τις προκαταρκτικές δοκιμές που δείχνουν την απόδοση αυτής της βιβλιοθήκης.

Η Hyper Host™ σας εύχεται μια ευχάριστη δουλειά στον κόσμο της JS και είναι έτοιμη να δημοσιεύσει τα υπέροχα έργα σας στον ιστότοπό μας!

4366 φορές 3 Προβλήθηκαν φορές σήμερα