Ιστορικό και κληρονομιά jQuery

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

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

Μια σύντομη ιστορία του jQuery

John Resig (Τζον Resig) δημιούργησε την πρώτη έκδοση της βιβλιοθήκης το 2005 και δημοσιεύθηκε το 2006-m, σε μια εκδήλωση που ονομάζεται BarCampNYC. Επί Επίσημος ιστότοπος jQuery ο συγγραφέας έγραψε:

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

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

// Select every item within the list of people within the contacts element
$('#contacts ul.people li');

Με τον καιρό, ο μηχανισμός επιλογής έγινε ξεχωριστή βιβλιοθήκη Τσιτσίρισμα.

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

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

// If Mozilla is used
if ( jQuery.browser == "mozilla" || jQuery.browser == "opera" ) {
        // Use the handy event callback
        jQuery.event.add( document, "DOMContentLoaded", jQuery.ready );

// If IE is used, use the excellent hack by Matthias Miller
// http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited
} else if ( jQuery.browser == "msie" ) {

        // Only works if you document.write() it
        document.write("<scr" + "ipt id=__ie_init defer=true " + 
                "src=javascript:void(0)></script>");

        // Use the defer script hack
        var script = document.getElementById("__ie_init");
        script.onreadystatechange = function() {
                if ( this.readyState == "complete" )
                        jQuery.ready();
        };

        // Clear from memory
        script = null;

// If Safari  is used
} else if ( jQuery.browser == "safari" ) {
        // Continually check to see if the document.readyState is valid
        jQuery.safariTimer = setInterval(function(){
                // loaded and complete are both valid states
                if ( document.readyState == "loaded" || 
                        document.readyState == "complete" ) {

                        // If either one are found, remove the timer
                        clearInterval( jQuery.safariTimer );
                        jQuery.safariTimer = null;

                        // and execute any waiting functions
                        jQuery.ready();
                }
        }, 10);
}

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

Αργότερα, το jQuery διευκόλυνε την εφαρμογή πιο περίπλοκων τεχνολογιών όπως τα κινούμενα σχέδια και το Ajax. Η βιβλιοθήκη έχει γίνει ουσιαστικά μια τυπική εξάρτηση για ιστότοπους. Και σήμερα τροφοδοτεί ένα τεράστιο μερίδιο του Διαδικτύου. Το πιστεύει η W3Techs Το 74% των τοποθεσιών σήμερα χρησιμοποιούν jQuery.

Ο έλεγχος στην ανάπτυξη του jQuery έχει επίσης γίνει πιο επίσημος. Το 2011 η ομάδα δημιούργησε το jQuery Board. Και το 2012 jQuery Board μετατράπηκε σε jQuery Foundation.

Το 2015, το jQuery Foundation συγχωνεύτηκε με το Dojo Foundation, για τη δημιουργία JS Foundation, το οποίο στη συνέχεια συγχωνεύτηκε με το Node.js Foundation στο 2019-m να δημιουργήσω Ίδρυμα OpenJS, εντός του οποίου το jQuery ήταν ένα από τα «πρωτοποριακά έργα».

Μεταβαλλόμενες συνθήκες

Ωστόσο, τα τελευταία χρόνια jQuery έχασε τη δημοτικότητά του. GitHub αφαίρεσε τη βιβλιοθήκη από το frontend του ιστότοπού μου. Bootstrap v5 ξεφορτωθείτε το jQueryγιατί είναι δικό του"μεγαλύτερη εξάρτηση πελάτη για κανονική JavaScript"(επί του παρόντος 30 KB σε μέγεθος, ελαχιστοποιημένο και συσκευασμένο). Αρκετές τάσεις στην ανάπτυξη Ιστού έχουν αποδυναμώσει τη θέση του jQuery ως ουσιαστικού εργαλείου.

Φυλλομετρητές

Για διάφορους λόγους, οι διαφορές και οι περιορισμοί του προγράμματος περιήγησης έχουν γίνει λιγότερο σημαντικοί. Πρώτον, η τυποποίηση έχει βελτιωθεί. Μεγάλοι προγραμματιστές προγραμμάτων περιήγησης (Apple, Google, Microsoft και Mozilla) συνεργάζονται για την ανάπτυξη πρότυπα ιστού στα πλαίσια Ομάδα Εργασίας Τεχνολογίας Εφαρμογών Υπερκειμένου Ιστού.
Αν και τα προγράμματα περιήγησης εξακολουθούν να διαφέρουν μεταξύ τους με πολλούς σημαντικούς τρόπους, οι προμηθευτές έχουν τουλάχιστον έναν τρόπο αναζήτησης και δημιουργίας μιας κοινής βάσης δεδομένων αντί για μόνιμος πόλεμος μαζί. Αντίστοιχα, τα API του προγράμματος περιήγησης έχουν αποκτήσει νέες δυνατότητες. Π.χ, φέρω API μπορεί να αντικαταστήσει τις λειτουργίες Ajax από το jQuery:

// jQuery
$.getJSON('https://api.com/songs.json')
    .done(function (songs) {
        console.log(songs);
    })

// native
fetch('https://api.com/songs.json')
    .then(function (response) {
        return response.json();
    })
    .then(function (songs) {
        console.log(songs);
    });

Μέθοδοι querySelector и querySelectorAll διπλότυπα jQuery pickers:

// jQuery
const fooDivs = $('.foo div');

// native
const fooDivs = document.querySelectorAll('.foo div');

Τώρα μπορείτε να χειριστείτε τις κατηγορίες στοιχείων χρησιμοποιώντας classList:

// jQuery
$('#warning').toggleClass('visible');

// native
document.querySelector('#warning').classList.toggle('visible');

Η ιστοσελίδα Ίσως να μην χρειάζεστε jQuery Ακολουθούν μερικές ακόμη περιπτώσεις στις οποίες ο κώδικας jQuery μπορεί να αντικατασταθεί με εγγενή κώδικα. Ορισμένοι προγραμματιστές μένουν πάντα με το jQuery επειδή απλά δεν γνωρίζουν για τα νέα API, αλλά όταν το γνωρίζουν, αρχίζουν να χρησιμοποιούν τη βιβλιοθήκη λιγότερο συχνά.

Η χρήση εγγενών λειτουργιών βελτιώνει την απόδοση της σελίδας. Πολλά εφέ κινούμενων σχεδίων από το jQuery τώρα μπορείτε να εφαρμόσετε πολύ πιο αποτελεσματικό χρησιμοποιώντας CSS.

Ο δεύτερος λόγος είναι ότι τα προγράμματα περιήγησης ενημερώνονται πολύ πιο γρήγορα από πριν. Τα περισσότερα από αυτά χρησιμοποιούν «αειθαλής» στρατηγική ανανέωσης, με εξαίρεση το Apple Safari. Μπορούν να ενημερωθούν στο παρασκήνιο χωρίς τη συμμετοχή του χρήστη και δεν συνδέονται με ενημερώσεις λειτουργικού συστήματος.

Αυτό σημαίνει ότι οι νέες δυνατότητες του προγράμματος περιήγησης και οι διορθώσεις σφαλμάτων διανέμονται πολύ πιο γρήγορα και οι προγραμματιστές δεν χρειάζεται να περιμένουν μέχρι Μπορώ να χρησιμοποιήσω θα φτάσει σε αποδεκτό επίπεδο. Μπορούν να χρησιμοποιούν με σιγουριά νέες δυνατότητες και API χωρίς να κάνουν λήψη jQuery ή polyfills.

Ο τρίτος λόγος είναι ότι ο Internet Explorer πλησιάζει σε κατάσταση πλήρους ασχετοσύνης. Ο IE είναι εδώ και καιρό ο όλεθρος της ανάπτυξης ιστού σε όλο τον κόσμο. Τα σφάλματα του ήταν ευρέως διαδεδομένα και επειδή ο IE κυριάρχησε τη δεκαετία του 2000 και δεν χρησιμοποιούσε μια αειθαλής στρατηγική ενημέρωσης, οι παλαιότερες εκδόσεις εξακολουθούν να είναι κοινές.

Το 2016, η Microsoft επιτάχυνε τον παροπλισμό του IE, παύοντας να υποστηρίζει δέκατη και παλαιότερες εκδόσεις, περιορίζοντας την υποστήριξη στον IE 11. Και όλο και περισσότερο, οι προγραμματιστές ιστού έχουν την πολυτέλεια να αγνοούν τη συμβατότητα με IE.

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

Νέα πλαίσια

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

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

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

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

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

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

Πότε να χρησιμοποιήσετε το jQuery;

Οπότε πότε πρέπει να είναι χρήση jQuery;

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

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

Στο άλλο άκρο της κλίμακας βρίσκονται απλοί ιστότοποι που απαιτούν μόνο λίγη διαδραστικότητα ή δυναμικό περιεχόμενο. Δεν θα έβαζα προεπιλογή στο jQuery ούτε σε αυτές τις περιπτώσεις, επειδή υπάρχουν πολλά περισσότερα που μπορείτε να κάνετε με εγγενή API.

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

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

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

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

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

Ατενίζοντας το μέλλον

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

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

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

Πηγή: www.habr.com

Προσθέστε ένα σχόλιο