להשתמש ב-Screen Wake Lock API כדי להישאר במצב ער

Screen Wake Lock API מאפשר למנוע ממכשירים לעמעם או לנעול את המסך כשהאפליקציה צריכה להמשיך לפעול.

כדי למנוע שחיקה של הסוללה, רוב המכשירים עוברים למצב שינה במהירות כשהם לא בשימוש. ברוב המקרים זה בסדר, אבל אפליקציות מסוימות צריכות להפעיל את המסך כדי להשלים את העבודה שלהן. לדוגמה, אפליקציות בישול שבהן מוצגים השלבים של מתכון או של משחק כמו Ball Puzzle, שמשתמשת בממשקי ה-API של התנועה במכשיר לצורך קלט.

Screen Wake Lock API מספק דרך למנוע מהמכשיר לעמעם את המסך ולנעול אותו. היכולת הזו מאפשרת לכם ליהנות מחוויית שימוש חדשה, שלפני כן נדרשה לה אפליקציה ספציפית לפלטפורמה.

ה-Screen Wake Lock API מפחית את הצורך בדרכים חלופיות לא יעילות שעלולות לצרוך הרבה חשמל. הוא פותר את הבעיות של ממשק API ישן יותר, שהיה מוגבל רק לשמירה על המסך דלוק, וכלל מספר בעיות אבטחה ופרטיות.

תרחישים לדוגמה לשימוש ב-Screen Wake Lock API

RioRun, אפליקציית אינטרנט שפותחה על ידי The Guardian, הייתה תרחיש לדוגמה מושלם (למרות שהיא כבר לא זמינה). האפליקציה מאפשרת לכם לצאת לסיור אודיו וירטואלי בריו, לאורך המסלול של המרתון האולימפי של 2016. בלי נעילת ההתעוררות, המסכים של המשתמשים היו נכבים לעיתים קרובות במהלך הסיור, מה שמקשה על השימוש בו.

כמובן, יש הרבה תרחישי שימוש אחרים:

  • אפליקציית מתכונים שמאפשרת להשאיר את המסך דלוק בזמן האפייה של עוגה או הכנת ארוחת ערב
  • אפליקציה של כרטיס או כרטיס עלייה למטוס שבה המסך נשאר דלוק עד לסריקת הברקוד
  • אפליקציה בסגנון קיוסק שמשאירה את המסך פועל באופן רציף
  • אפליקציית מצגות מבוססת-אינטרנט שמשאירה את המסך פועל במהלך מצגת

הסטטוס הנוכחי

שלב סטטוס
1. יצירת הסבר לא רלוונטי
2. יצירת טיוטה ראשונית של המפרט הושלם
3. איך אוספים משוב ומבצעים שיפורים בעיצוב הושלם
4. גרסת מקור לניסיון הושלם
5. השקה הושלם

שימוש ב-Screen Wake Lock API

סוגי חסימות מצב שינה

נכון לעכשיו, Screen Wake Lock API מספק רק סוג אחד של מנעול התעוררות: screen.

screen חסימת מצב שינה

נעילה למצב שינה מסוג screen מונעת את כיבוי המסך של המכשיר כדי שהמשתמש יוכל לראות את המידע שמוצג במסך.

קבלת נעילת מסך במצב שינה

כדי לבקש נעילת מסך במצב שינה, צריך להפעיל את השיטה navigator.wakeLock.request() שמחזירה אובייקט WakeLockSentinel. מעבירים לשיטה הזו את סוג נעילת ההתעוררות הרצוי כפרמטר, שהוא כרגע מוגבל רק ל-'screen' ולכן הוא אופציונלי. הדפדפן יכול לדחות את הבקשה מסיבות שונות (למשל, כי רמת הטעינה של הסוללה נמוכה מדי), ולכן מומלץ לתחום את הקריאה בהצהרה try…catch. הודעת החריגה תכלול פרטים נוספים במקרה של כשל.

שחרור של נעילה מצב שינה במסך

צריך גם דרך לשחרר את נעילת המסך להפעלה, ואפשר לעשות זאת על ידי קריאה ל-method‏ release() של האובייקט WakeLockSentinel. אם לא שומרים הפניה ל-WakeLockSentinel, אי אפשר לבטל את הנעילה באופן ידני, אבל היא תתבטל ברגע שהכרטיסייה הנוכחית תהיה בלתי נראית.

אם רוצים לבטל באופן אוטומטי את נעילת המסך אחרי פרק זמן מסוים, אפשר להשתמש ב-window.setTimeout() כדי לקרוא ל-release(), כפי שמתואר בדוגמה הבאה.

// The wake lock sentinel.
let wakeLock
= null;

// Function that attempts to request a screen wake lock.
const requestWakeLock = async () => {
 
try {
    wakeLock
= await navigator.wakeLock.request();
    wakeLock
.addEventListener('release', () => {
      console
.log('Screen Wake Lock released:', wakeLock.released);
   
});
    console
.log('Screen Wake Lock released:', wakeLock.released);
 
} catch (err) {
    console
.error(`${err.name}, ${err.message}`);
 
}
};

// Request a screen wake lock…
await requestWakeLock
();
// …and release it again after 5s.
window
.setTimeout(() => {
  wakeLock
.release();
  wakeLock
= null;
}, 5000);

לאובייקט WakeLockSentinel יש מאפיין שנקרא released, שמציין אם כבר שוחרר סנטינל. הערך שלו הוא false בהתחלה, והוא משתנה ל-true אחרי שאירוע "release" נשלח. הנכס הזה עוזר למפתחי אתרים לדעת מתי נעילת ה-lock נפתחה, כדי שלא יצטרכו לעקוב אחרי זה באופן ידני. התכונה זמינה החל מגרסה 87 של Chrome.

מחזור החיים של חסימת מצב שינה במסך

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

כדי לקבל מחדש את נעילת מצב השינה במסך, צריך להאזין לאירוע visibilitychange ולבקש נעילת מצב שינה במסך חדשה כשהאירוע מתרחש:

const handleVisibilityChange = async () => {
 
if (wakeLock !== null && document.visibilityState === 'visible') {
    await requestWakeLock
();
 
}
};

document
.addEventListener('visibilitychange', handleVisibilityChange);

צמצום ההשפעה על משאבי המערכת

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

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

  • אם האפליקציה מבצעת הורדות ממושכות, כדאי להשתמש באחזור ברקע.
  • אם האפליקציה מסנכרנת נתונים משרת חיצוני, כדאי להשתמש בסנכרון ברקע.

הדגמה (דמו)

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

נעילת מסך במנהל המשימות של מערכת ההפעלה

תוכלו להשתמש במנהל המשימות של מערכת ההפעלה כדי לבדוק אם אפליקציה מונעת מהמחשב לעבור למצב שינה. בסרטון הבא מוצג Activity Monitor ב-macOS, שמציין של-Chrome יש נעילה פעילה של מסך ההתעוררות ששומרת על פעילות המערכת.

משוב

קבוצת הקהילה של Web Platform Incubator (WICG) וצוות Chrome רוצים לשמוע את המחשבות והחוויות שלכם לגבי Screen Wake Lock API.

תיאור של עיצוב ה-API

האם יש משהו ב-API שלא פועל כצפוי? או שאולי חסרות שיטות או מאפיינים שצריך ליישם את הרעיון?

דיווח על בעיה בהטמעה

מצאתם באג בהטמעה של Chrome? או שההטמעה שונה מהמפרט?

  • שולחים דיווח על באג בכתובת https://new.crbug.com. חשוב לכלול כמה שיותר פרטים, לספק הוראות פשוטות לשחזור הבאג ולהגדיר את Components לערך Blink>WakeLock. Glitch הוא כלי מצוין לשיתוף שחזור מהיר וקל של באגים.

תמיכה ב-API

אתם מתכננים להשתמש ב-Screen Wake Lock API? התמיכה הציבורית שלכם עוזרת לצוות Chrome לתת עדיפות לתכונות, ומראה לספקי דפדפנים אחרים כמה חשוב לתמוך בהם.

קישורים שימושיים

תודות

תמונה ראשית (Hero) של Kate Stone Matheson ב-Unsplash. סרטון של מנהל המשימות באדיבות הנרי לים.