Il 7 giugno, Apple ha rilasciato un aggiornamento del proprio browser Web, Safari 5. Comprende una pletora di nuove funzionalità per gli sviluppatori Web, tra cui un motore JavaScript più veloce, un migliore supporto HTML5, supporto per le estensioni e un ottimo aggiornamento di Web Inspector. Esploreremo cosa significano queste nuove funzionalità per gli sviluppatori web.
Un buon ispettore web è estremamente importante per la maggior parte degli sviluppatori web. Molte persone preferiscono ancora Firebug, che è un'estensione per Firefox, ma l'ispettore Webkit è migliorato notevolmente negli ultimi anni.
In Safari 5, il web inspector è migliorato Ispettore CSS pannello, che consente di passare direttamente a una definizione di regola nel file di origine.
Il Ispettore DOM è molto migliorato, ora consente di aggiungere attributi ai nodi DOM nel documento, rimuovere nodi e modificare i nodi come HTML, che consente di modificare l'intero tag come se si trattasse di un file sorgente.
Il Pannello Risorse è anche migliorato, permettendoti di vedere tutti i reindirizzamenti HTTP, insieme alle informazioni complete sull'intestazione, incluso il codice di stato HTTP.
Il Ispettore JavaScript ora consente di disabilitare tutti i punti di interruzione con un solo clic e, se si passa con il mouse su un elemento mentre si trova su un punto di interruzione, è possibile visualizzare i valori degli oggetti effettivi di ciò che si sta passando sopra. Questo sarà estremamente utile per scopi di debug!
Safari 5 ora ha un nuovo pannello Timeline, che fornisce informazioni su tutto ciò che il browser sta facendo mentre navighi. Ciò include il caricamento dei dati, l'analisi, la visualizzazione sullo schermo e il rendering. Molto interessante per lavorare sulle prestazioni del tuo sito Web o applicazione.
Un altro pannello aggiunto è il Pannello di controllo, che è molto simile alle popolari estensioni YSlow e Google Page Speed per Firebug, suggerisce modi per migliorare le prestazioni e la compatibilità del tuo sito.
L'ultima modifica a Web Inspector è che un pannello separato per Console JavaScript è stato creato. Questo è bello perché consente alla console di occupare l'intera altezza di Web Inspector piuttosto che la piccola parte a cui era abituata. È ancora disponibile nella vecchia posizione, tuttavia, per un accesso comodo mentre si guarda un altro pannello. Per ulteriori informazioni sugli aggiornamenti di Web Inspector, consulta questo post sul blog Webkit.
Apple detiene diciassette nuove funzionalità HTML5 in Safari 5 e potresti aver sentito parlare della loro vetrina HTML5 che hanno lanciato la settimana scorsa (contiene davvero più CSS3 di qualsiasi altra cosa, ma sembra che si stia amplificando anche sotto HTML5!). Apple sembra davvero spingere HTML5 e Safari 5 ora ha un punteggio di 136 su html5test.com, che è salito da 113 nella versione precedente. Alcune delle nuove funzionalità HTML5 contenute in Safari 5 includono:
Dai un'occhiata alla lista completa qui sotto.
Safari 5 include due nuove funzionalità HTML5 per le applicazioni web in tempo reale, come Friendfeed e Twitter. WebSocket è il primo e EventSource è il secondo. Ora che tre dei principali browser, Firefox, Chrome e Safari hanno implementato la specifica WebSocket, la scrittura di webapp in tempo reale usando qualcosa come Node.js per un backend sta diventando molto più fattibile.
WebSocket è essenzialmente un canale di comunicazione bidirezionale tra la tua webapp nel browser e il server.
Dal momento che è a due vie, potresti scrivere qualcosa come un client Twitter che lo usa e avere nuovi messaggi di Twitter che appaiono automaticamente mentre vengono inviati dal server, e anche spingere nuovi tweet mentre sono scritti. EventSource è un meccanismo di comunicazione unidirezionale che consente al server di inviare eventi al client ma non viceversa. Se vuoi saperne di più su EventSource, dai un'occhiata a questo tutorial.
Poiché è stato scritto utilizzando queste tecnologie, per qualcuno sarà possibile scrivere una libreria di sviluppo delle estensioni multipiattaforma che funziona su Firefox (Jetpack), Chrome e Safari 5.
Ora c'è un supporto per le estensioni in Safari e, grazie a un nuovo strumento chiamato Extension Builder nel già utile menu Sviluppo, puoi scriverne uno tuo. Le estensioni sono scritte utilizzando tecnologie web standard, tra cui HTML, CSS e JavaScript e l'API di estensioni fornita da Apple. Poiché è stato scritto utilizzando queste tecnologie, per qualcuno sarà possibile scrivere una libreria di sviluppo delle estensioni multipiattaforma che funziona su Firefox (Jetpack), Chrome e Safari 5. Tutti usano le tecnologie web per creare estensioni per i loro browser. Per motivi di sicurezza, tutte le estensioni per Safari 5 devono essere firmate crittograficamente da Apple tramite il loro Centro Safari Dev.
Più tardi quest'estate, Apple aprirà la Galleria Safari Extensions che offrirà agli utenti un posto facile per trovare le estensioni di installazione. Panic sta già mostrando la loro estensione chiamata Code Notes, che, quando uscirà, ti permetterà di aggiungere annotazioni alle pagine web disegnando e scrivendo note di testo direttamente sul sito. L'estensione ti consentirà quindi di condividere le tue annotazioni via email. Un esempio molto interessante di ciò che l'API di estensioni di Safari 5 è in grado di fare.
Non sarebbe un aggiornamento completo del browser se Apple non avesse propagandato il suo motore JavaScript più veloce del 30%. Nel test delle prestazioni JavaScript di SunSpider, Safari si posiziona in modo simile a Google Chrome ed è ancora molto più avanti dell'ultima versione di Firefox. Mentre le prestazioni di JavaScript sono importanti, i veri e propri colli di bottiglia delle prestazioni per le applicazioni Web non si trovano nelle prestazioni del linguaggio JavaScript, ma nell'API DOM, notoriamente lento in tutti i browser. Spero che si presti più attenzione alle prestazioni DOM in futuro.
Anche se non specificamente una funzione di sviluppatore web, sono sicuro che leggi molti articoli come questo sul web. Safari Reader è essenzialmente un modo per eliminare tutte le distrazioni mentre leggi solo l'articolo. Proprio come il bookmarklet Readability, Safari Reader riconosce automaticamente le pagine con un articolo e presenta un pulsante nella barra degli strumenti che estrae il testo e le immagini dalla sezione dell'articolo della pagina e le visualizza in un font leggibile. È anche molto bello poter inviare e-mail e stampare facilmente l'articolo mentre guardi la vista Lettore. Sono sicuro che lo userò molto!
Sebbene non sia una release importante in termini di funzionalità utente, Safari 5 è una versione molto bella per gli sviluppatori. Con un supporto HTML5 molto migliorato, prestazioni JavaScript migliorate e un migliore Web Inspector, Safari è ora il mio browser di sviluppo preferito. E tu?