בודקים את התשובה במכשיר של התלמיד
כשלוחצים על הכפתור, הדפדפן בודק את הקוד בתוך המרחב המבודד שלו. ראינו שאפשר, בנינו מנוע בדיקות משלנו, ובנינו אותו מחדש כשגילינו שהוא סימן תשובות נכונות כשגויות.
4 דקות קריאה
בנינו את שפי לומדה כך שלא צריך שרת כדי לבדוק תשובה. הכול קורה במחשב של התלמיד, גם אם חיבור האינטרנט נפל. טעינה מחדש של הדף כן דורשת אינטרנט.
מה זה שרת?
שרת הוא מחשב, בדרך כלל רחוק, שעונה לבקשות של הדפדפן: הוא שומר דפים ונתונים ועושה עבודה בשבילו. אתר יכול לבקש משרת לבדוק את התשובה שלכם, או שהדפדפן שלכם יכול לעשות זאת בעצמו. כאן הדפדפן עושה את זה, ולכן שום שרת לא צריך לקבל את התשובה.
לוחצים על כפתור “בדיקות” בשיעור של שפי לומדה והתוצאה מופיעה בדף.
בקצרה
- הבדיקה מתבצעת במכשיר של התלמיד, לא בשרת.
- הבנו את הגישה מההתחלה, אחרי שראינו קורס JavaScript קיים שעושה את זה.
- גילינו שמנוע הבדיקות הראשון שלנו, התוכנה שמריצה את הבדיקות, סימן תשובות נכונות כשגויות. ב־19 ביולי 2026 בנינו אותו מחדש והעברנו את כל בדיקות ה־JavaScript למקום משותף אחד.
- הבדיקה רצה כשלוחצים על הכפתור, לא תוך כדי הקלדה.
מהי בדיקה
בדיקה היא שאלה קטנה על התשובה שלכם. האם הפונקציה הזאת מחזירה 4 כשנותנים לה 2? האם בדף הזה יש כותרת? האם לפסקה הזאת יש עיצוב מסוים? בשיעור יש קומץ בדיקות כאלה, והתוצאה מציגה כל אחת מהן במילים פשוטות.
איפה זה רץ
שיעורים שונים צריכים דרכים שונות להריץ את הקוד, ולכן למנוע הבדיקות שלנו יש שלוש.
- JavaScript רגיל רץ בעזרת עוזר ברקע (Worker)
- HTML ו־CSS הדפדפן עצמו קורא את הדף שכתבתם, והבדיקות מסתכלות על מה שהוא מצא
- דפים ו־React רץ במסגרת נסתרת בתוך הדף
בשלושתן הקוד של התלמיד רץ במכשיר של התלמיד, בתוך ארגז החול של הדפדפן, המרחב המבודד שלו לדפי אינטרנט, בנפרד משאר המחשב. זו לא כספת. העיקר הוא שאין צורך בשרת כדי לבדוק.
מה זו מסגרת נסתרת?
מסגרת (Frame) היא חלון קטן בתוך דף אינטרנט שמציג דף אחר, כמו מסגרת תמונה על קיר שמראה תמונה אחרת. מסגרת נסתרת היא כזו שלא רואים. הקוד של השיעור רץ בתוכה, בנפרד מהדף שסביבה, והיא מוסרת כשהבדיקה מסתיימת.
מה זה ארגז חול?
ארגז חול (Sandbox) הוא אזור מגודר שבו תוכנה יכולה לרוץ, אבל אין לה גישה לשום דבר שמחוץ לגדר. השם בא מארגז החול של ילדים: אפשר לבנות ולהרוס בו כמה שרוצים, והבלגן נשאר בפנים. הדפדפן שלכם מכניס כל דף אינטרנט לארגז חול כזה, ולכן הקוד שבדף לא יכול, בעצמו, לקרוא את הקבצים שלכם או לשנות את ההגדרות שלכם. הקוד של התלמיד רץ בתוכו.
מה זה עוזר ברקע?
עוזר ברקע (Worker) הוא תוכנה קטנה שהדפדפן מריץ בנפרד מהדף שאתם רואים, כדי שעבודה כבדה לא תקפיא את הדף. אין לו גישה לדף עצמו.
מאיפה הגיע הרעיון
JS Hero (נפתח בלשונית חדשה), קורס JavaScript חינמי מגרמניה, בודק תשובות בדפדפן בעזרת עוזר ברקע ופונקציות בדיקה קטנות. הבנו איך זה עובד מההתחלה, וזה הראה לנו שהרעיון מעשי. כתבנו מנוע בדיקות משלנו, ובדיקות ה־HTML, ה־CSS וה־React הן גם שלנו, כי הקורס ההוא מלמד רק JavaScript.
מנוע הבדיקות הראשון שלנו טעה בחלק מהתשובות
מנוע הבדיקות הראשון שלנו השווה תשובות בדרך שמתאימה למספרים ולמילים אבל לא למערכים. שיעור שהתשובה בו היא מערך היה יכול להיות מסומן כשגוי גם כשהיה נכון, כי שני מערכים שנראים זהים אינם אותו דבר מבחינת המחשב. ב־19 ביולי 2026 בנינו מחדש את קוד הבדיקה. העברנו את כל בדיקות ה־JavaScript למקום משותף אחד, שבו משתמשים גם העוזר ברקע וגם שיעורי ה־JavaScript שעובדים עם דף אינטרנט עצמו (אלה ששינו דף). בנוסף תיקנו תקלה שבגללה חלק מהשיעורים האלה לא התחילו לרוץ.
מה זה מערך?
מערך (Array) הוא שורה של ערכים ששמורים יחד תחת שם אחד, כמו מדף עם תאים ממוספרים שבכל תא מונח פריט אחד: שלוש מילים, חמישה מספרים, כל דבר. מתכנתים משתמשים בהם כל הזמן. שני מדפים שמלאים בדיוק באותם פריטים הם עדיין שני מדפים שונים, וכך המחשב רואה שני מערכים שנראים אותו דבר, אלא אם מבקשים ממנו להשוות את מה שבתוכם.
לא תוך כדי הקלדה
הבדיקה רצה כשלוחצים על הכפתור, לא בכל לחיצה על מקש. זה בכוונה. בדיקה מפעילה משימה קטנה ברקע, ואם כל הקשה הייתה מתחילה אחת, לשונית הדפדפן הייתה עסוקה כל הזמן והייתה משתמשת ביותר ויותר זיכרון. לכן בדיקה רצה רק לפי בקשה, ושיעורי ה־JavaScript משתמשים שוב באותו עוזר ברקע במקום להפעיל חדש בכל פעם. השיעורים על דפי אינטרנט ועל React משתמשים במסגרת נסתרת, שמוסרת מיד כשהבדיקה מסתיימת.
מה שכן קורה תוך כדי הקלדה הוא קטן. הטיוטה שלכם נשמרת בדפדפן, במכשיר שלכם, ולכן שום דבר לא הולך לאיבוד. אם התחברתם לחשבון ובחרתם בסנכרון, ההתקדמות שלכם נשמרת גם בענן, כדי שאפשר יהיה להמשיך ממכשיר אחר. אבל היא לא נשלחת לענן בכל הקשה: המערכת ממתינה עד שתפסיקו להקליד לרגע, ושולחת הכול בפעם אחת.
מה זו הגבלת קצב?
הגבלת קצב (Throttling) פירושה להגביל כמה פעמים משהו יכול לקרות, כדי שעבודה עמוסה לא תציף את הדפדפן. הסנכרון שלנו לענן משתמש בקרוב משפחה שנקרא Debounce: הוא ממתין עד שמפסיקים להקליד לרגע, ואז שולח הכול פעם אחת, במקום לשלוח בכל מקש.
מה זה אומר לתלמיד
הניסיונות של התלמיד לא נשלחים לשום מקום כדי שיבדקו אותם. דבר אחד נפרד: אם תלמיד נכנס לחשבון ובוחר בסנכרון, ההתקדמות השמורה שלו, שכוללת את הפתרונות, יכולה להישמר בענן. זו בחירה, והיא לא קשורה לבדיקה עצמה.
שום דבר בסיפור הזה לא מתאים לחיפוש.
עוד סיפורי מקרה לקריאה
כותבים 306 שיעורים לקוראי עברית ואנגליתשיעורי ה־JavaScript הראשונים היו קרובים מדי לקורס שנתן לנו את הרעיון, אז זרקנו אותם וכתבנו משלנו, בעברית ובאנגלית, עם דוגמאות מהחיים.
תיבת טקסט שמרגישה כמו עורך קוד אמיתיתלמידים מקלידים קוד בתיבה פשוטה. הפכנו אותה לעורך קוד קטן, כדי ש־Visual Studio Code או כל עורך אחר לא יהיו חדשים כשיגיעו אליהם.