רקע
אפקטים של מסננים קיימים כבר זמן מה, אבל תוכננו לפעול ב-SVG. יש להם עוצמה אדירה ליישם אפקטים כמו עוצמת צבע, עיוות או טשטוש על תמונה לפני שמשלבים אותה ומעבדים אותה למסמך.
ב-2009, ב-Mozilla אמרו ש-SVG לא מספיק! בסופו של דבר, החברה לקחה את המסננים צעד אחד קדימה והתאפשרה לשימוש בתוכן HTML ב-Firefox 3.5. כדאי לראות את ההדגמה הנצחית של פול אירלנד של מסנני SVG במכשיר <video> שפועל. שוב, פועל רק ב-Firefox, אבל עדיין ב'ברכיים'.
היום
Flash קדימה לסוף 2011 ו-Adobe (יחד עם אחרות) משקיעים מאמצים רבים כדי להביא את הטכנולוגיה המדהימה הזו לשירות ה-CSS. אני מתייחסת ל-CSS Filter Effects 1.0, ש-WebKit התחיל להטמיע.
הפעלת מסננים ישירות ב-CSS פירושה שכמעט כל רכיב DOM יכול לנצל אותם! תמונות, <video>, <canvas>, מה שתרצו.
פרופיל
במפרט מוגדרים גם תוכנות הצללה (shader) של CSS, שבסופו של דבר יספקו ל-CSS את טכנולוגיית ההצללה של OpenGL. זה מאוד מרגש! עם זאת, יש שיקולי אבטחה בכל פעם שפותחים את ה-GPU במערכת. מסיבה זו, ב-WebKit מיושמות בשלב זה רק פונקציות סינון של CSS.
תמיכה
Chrome 18.0.976.0 (נכון לעכשיו, גרסה ראשונית), Webkit מדי לילה
בלילה של Webkit, ניתן להחיל מסננים על תוכן עם שיפור מהירות באמצעות חומרה ( למשל img { -webkit-transform: translateZ(0); } ). ב-Chrome, מסננים לתוכן מואץ עדיין בתהליך עבודה (יש להשתמש בדגל --enable-accelerated-filters). ההגדרה הזו כוללת <video>, שמואצת כברירת מחדל.