Contesto
Gli effetti dei filtri esistono da un po' di tempo, ma sono stati progettati per funzionare in formato SVG. Questi strumenti sono estremamente potenti per applicare effetti come l'intensità del colore, la deformazione o la sfocatura a un'immagine prima che venga composita e visualizzata nel documento.
Nel 2009 Mozilla diceva che SVG non era sufficiente. Hanno finito per fare un ulteriore passo avanti per usare i filtri e li hanno autorizzati nei contenuti HTML in Firefox 3.5. Dai un'occhiata all'intramontabile demo di filtri SVG di Paul Ireland su un gioco <video>. Ribadiamo che funziona solo con Firefox, ma che non si ferma sulle ginocchia.
Oggi
Flash alla fine del 2011 e Adobe (e altri ancora) si sono impegnati a fondo per introdurre questa incredibile tecnologia in CSS. Nello specifico, mi riferisco agli Effetti filtro CSS 1.0, che WebKit ha iniziato a implementare.
Se attivi i filtri direttamente in CSS, quasi tutti gli elementi DOM possono sfruttarli. Immagini, <video>, <canvas>, tu scegli il nome.
Profilo
La specifica definisce anche gli shadower CSS, che in futuro applicheranno la tecnologia OpenGL dello strumento a CSS. È MOLTO emozionante! Tuttavia, bisogna fare attenzione alla sicurezza ogni volta che apri la GPU di un sistema. Per questo motivo, al momento WebKit ha solo funzioni di filtro CSS implementate.
Assistenza
Chrome 18.0.976.0 (attualmente canary), Webkit notturno
Nei contenuti notturni del Webkit, è possibile applicare filtri ai contenuti con accelerazione hardware ( ad es. img { -webkit-transform: translateZ(0); }). In Chrome, i filtri sui contenuti accelerati sono ancora in fase di sviluppo (utilizza il flag --enable-accelerated-filters). È incluso <video>, che è accelerato per impostazione predefinita.