Share
Le 7 juin, Apple a publié une mise à jour de son navigateur Web, Safari 5. Il inclut une pléthore de nouvelles fonctionnalités pour les développeurs Web, notamment un moteur JavaScript plus rapide, une meilleure prise en charge de HTML5, une prise en charge des extensions et une superbe mise à jour de Web Inspector. Nous allons explorer ce que ces nouvelles fonctionnalités signifient pour les développeurs Web..
Un bon inspecteur Web est extrêmement important pour la plupart des développeurs Web. Beaucoup de gens préfèrent encore Firebug, une extension de Firefox, mais l'inspecteur Webkit s'est considérablement amélioré ces dernières années..
Dans Safari 5, l'inspecteur Web dispose d'une version améliorée Inspecteur CSS panneau, qui vous permet de passer directement à une définition de règle dans le fichier source.
le Inspecteur DOM est beaucoup améliorée, vous permettant désormais d'ajouter des attributs aux nœuds DOM de votre document, de supprimer des nœuds et de modifier des nœuds au format HTML, ce qui vous permet de modifier la balise entière comme s'il s'agissait d'un fichier source.
le Panneau de ressources est également améliorée, vous permettant de voir toutes les redirections HTTP, ainsi que des informations d'en-tête complètes, y compris le code d'état HTTP.
le Inspecteur JavaScript vous permet maintenant de désactiver tous les points d'arrêt en un seul clic, et si vous survolez un élément alors que vous êtes sur un point d'arrêt, vous pouvez voir les valeurs réelles de l'objet sur lequel vous survolez. Cela sera extrêmement utile pour le débogage!
Safari 5 a maintenant un nouveau panneau de la timeline, qui fournit des informations sur tout ce que le navigateur fait pendant que vous naviguez. Cela inclut le chargement, l’analyse, l’affichage et le rendu des données. Très cool pour travailler sur les performances de votre site web ou de votre application.
Un autre panneau ajouté est le Panneau d'audits, qui, tout comme les extensions populaires YSlow et Google Page Speed pour Firebug, vous suggère des moyens d'améliorer les performances et la compatibilité de votre site..
La dernière modification apportée à l'inspecteur Web est qu'un panneau distinct pour le Console JavaScript a été créé. Cela est pratique car cela permet à la console d’occuper toute la hauteur de Web Inspector plutôt que la petite partie qu’elle occupait auparavant. Cependant, il est toujours disponible dans l'ancien emplacement pour un accès pratique tout en regardant un autre panneau. Pour plus d'informations sur les mises à jour de Web Inspector, consultez cette publication sur le blog Webkit..
Apple propose 17 nouvelles fonctionnalités HTML5 dans Safari 5, et vous avez peut-être entendu parler de la vitrine HTML5 qu'ils ont lancée la semaine dernière (elle contient plus de CSS3 qu'autre chose, mais elle semble également être classée sous HTML5!). Apple semble vraiment pousser HTML5, et Safari 5 a maintenant un score de 136 sur html5test.com qui est en hausse de 113 dans la version précédente. Certaines des nouvelles fonctionnalités HTML5 contenues dans Safari 5 comprennent:
Consultez la liste complète ci-dessous.
Safari 5 inclut deux nouvelles fonctionnalités HTML5 pour les applications Web en temps réel, telles que Friendfeed et Twitter. WebSocket est le premier et EventSource est le second. Maintenant que trois des principaux navigateurs, Firefox, Chrome et Safari, ont implémenté la spécification WebSocket, l'écriture d'applications Web en temps réel utilisant quelque chose comme Node.js pour un backend devient bien plus faisable.
WebSocket est essentiellement un canal de communication bidirectionnel entre votre application Web dans le navigateur et le serveur.
Comme il s'agit d'une solution à double sens, vous pouvez écrire quelque chose comme un client Twitter qui l'utilise, faire en sorte que les nouveaux messages Twitter apparaissent automatiquement au fur et à mesure qu'ils sont expulsés du serveur, et que les nouveaux tweets apparaissent au fur et à mesure qu'ils sont écrits.. EventSource est un mécanisme de communication à sens unique qui permet au serveur d’envoyer des événements au client, mais pas l’inverse. Si vous voulez en savoir plus sur EventSource, consultez ce tutoriel..
Du fait qu’il est écrit avec ces technologies, il sera possible d’écrire une bibliothèque de développement d’extensions multiplateformes qui fonctionne avec Firefox (Jetpack), Chrome et Safari 5..
Safari prend désormais en charge les extensions et, grâce à un nouvel outil appelé Extension Builder dans le menu Développer déjà utile, vous pouvez écrire le vôtre. Les extensions sont écrites à l'aide des technologies Web standard, notamment HTML, CSS et JavaScript, ainsi que de l'API Extensions fournie par Apple. Grâce à ces technologies, il est possible d’écrire une bibliothèque de développement d’extensions sur plusieurs plates-formes compatible avec Firefox (Jetpack), Chrome et Safari 5. Elles utilisent toutes les technologies Web pour créer des extensions pour leur navigateur. Pour des raisons de sécurité, toutes les extensions de Safari 5 doivent être signées de manière cryptographique par Apple via leur centre de développement Safari..
Plus tard cet été, Apple ouvrira la galerie d'extensions Safari, qui permettra aux utilisateurs de trouver facilement des extensions d'installation. Panic montre déjà leur extension appelée Code Notes, qui, à sa sortie, vous permettra d’ajouter des annotations aux pages Web en dessinant et en écrivant des notes de texte directement sur le site. L'extension vous permettra ensuite de partager vos annotations par courrier électronique. Un très bon exemple de ce que l'API des extensions Safari 5 est capable de.
Ce ne serait pas une mise à niveau complète du navigateur si Apple ne vantait pas son moteur JavaScript 30% plus rapide. Dans le test de performance SunSpider JavaScript, Safari se classe au même rang que Google Chrome et reste largement en avance sur la dernière version de Firefox. Bien que les performances JavaScript soient importantes, les goulots d'étranglement des performances des applications Web ne résident pas dans les performances du langage JavaScript brut, mais dans l'API DOM, qui est notoirement lente dans tous les navigateurs. J'espère que plus d'attention sera portée à la performance des DOM à l'avenir.
Bien que n'étant pas spécifiquement une fonctionnalité de développeur Web, je suis sûr que vous lisez beaucoup d'articles comme celui-ci sur le Web. Safari Reader est un moyen essentiel d’éliminer toutes les destructions en lisant l’article. Comme le bookmarklet Readability, Safari Reader reconnaît automatiquement les pages contenant un article et présente un bouton dans la barre d’outils qui extrait le texte et les images de la section article de la page et les affiche dans une belle police lisible. Il est également très agréable de pouvoir facilement envoyer un courriel et imprimer l’article en regardant la vue Lecteur. Je suis sûr que je vais l'utiliser beaucoup!
Bien qu’il ne s’agisse pas d’une version majeure en termes de fonctionnalités utilisateur, Safari 5 est une version très intéressante pour les développeurs. Avec une meilleure prise en charge de HTML5, des performances JavaScript améliorées et un meilleur Web Inspector, Safari est désormais mon navigateur de développement préféré. Et vous?
Accentsconagua