jQuery היסטוריה ומורשת

jQuery - זה הפופולרי ביותר בעולם ספריית JavaScript. קהילת פיתוח האינטרנט יצרה אותו בסוף שנות ה-2000, וכתוצאה מכך נוצרה מערכת אקולוגית עשירה של אתרים, תוספים ומסגרות באמצעות jQuery מתחת למכסה המנוע.

אבל בשנים האחרונות, מעמדו ככלי המוביל לפיתוח אתרים נשחק. בואו נסתכל למה jQuery הפך לפופולרי ולמה הוא יצא מהאופנה, וגם באילו מקרים עדיין מומלץ להשתמש בו ליצירת אתרים מודרניים.

היסטוריה קצרה של jQuery

ג'ון רזיג (ג'ון רסיג) יצר את הגרסה הראשונה של הספרייה בשנת 2005, ו פורסם בשנת 2006-מ, באירוע בשם 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 התמזגה עם קרן דוג'ו, כדי ליצור קרן JS, שהתמזגה אז עם קרן Node.js לתוך 2019-מ ליצור קרן OpenJS, שבתוכו jQuery היה אחד מה"פרויקטים פורצי דרך. »

נסיבות משתנות

עם זאת, בשנים האחרונות jQuery איבד את הפופולריות שלו. GitHub הסרתי את הספרייה מחזית האתר שלי. Bootstrap v5 להיפטר מ-jQueryכי זה שלו"התלות הגדולה ביותר בלקוח עבור JavaScript רגיל"(כרגע בגודל 30 KB, ממוזער וארוז). מספר מגמות בפיתוח אתרים החלישו את מעמדה של jQuery ככלי חיוני.

דפדפנים

מכמה סיבות, ההבדלים והמגבלות בדפדפן הפכו פחות חשובים. ראשית, הסטנדרטיזציה השתפרה. מפתחי דפדפנים גדולים (אפל, גוגל, מיקרוסופט ומוזילה) עובדים יחד על מנת לפתח תקני אינטרנט בתוך Web Hypertext Application Technology קבוצת עבודה.
למרות שדפדפנים עדיין שונים זה מזה במספר דרכים חשובות, לספקים יש לפחות אמצעי לחפש וליצור מסד נתונים משותף במקום מלחמה קבועה יַחַד. בהתאם לכך, ממשקי 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);
    });

שיטות שואל и querySelectorAll בוחרים כפולים של jQuery:

// 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, מיקרוסופט האיצה את פירוק IE, מפסיקים לתמוך גרסאות עשיריות וקדמות יותר, מוגבלות לתמיכה ב-IE 11. ויותר ויותר, למפתחי אינטרנט יש את המותרות להתעלם מתאימות IE.

אפילו jQuery הפסיקה לתמוך ב-IE 8 ומטה מאז גרסה 2.0, פורסם ב-2013. ולמרות שבמקרים מסוימים עדיין נדרשת תמיכת IE, למשל באתרים ישנים יותר, מצבים אלו מתעוררים פחות ופחות.

מסגרות חדשות

מאז הופעת jQuery, נוצרו מסגרות רבות, כולל מנהיגים מודרניים להגיב, זוויתי и Vue. יש להם שני יתרונות חשובים על פני 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