This is jpvincent's Typepad Profile.
Join Typepad and start following jpvincent's activity
jpvincent
Web app expert
Recent Activity
Rappel : migration vers braincracking.org
Pour ceux qui n'auraient pas mis à jour leur bookmark ou leur fil RSS, je rappelle que http://jpv.typepad.com a migré vers http://braincracking.org ! Vous avez déjà loupé un article et plusieurs news :) Le fil RSS définitif est http://feeds.feedburner.com/braincracking A tout de suite :) Continue reading
Posted Sep 10, 2010 at Brain Cracking
Comment
0
Migration vers braincracking.org
Après 9 mois d'existence, ce blog migre vers un nouveau domaine : http://braincracking.org. Au tout début je n'étais pas sur de tenir le rythme ou de trouver un vrai intérêt à faire ce blog, mais en faisant le bilan j'ai décidé de continuer : 145 revues de presse couvrant l'actualité du développement d'applications Web, ça commence à faire du contenu intéressant : au bout de quelques mois, je me suis rendu compte que j'utilisais beaucoup le moteur de recherche (de mon lecteur de RSS : thunderbird) pour retrouver d'anciens articles et tutoriaux, et que mes commentaires de l'époque m'aidaient en... Continue reading
Posted Aug 17, 2010 at Brain Cracking
Comment
0
RPW 11/08/10: faire un fallback pour HTML5 Forms, teste l'existence d'une valeur en Javascript, serveur WebSocket en PHP, IE9 beta1 en automne
2 grosses semaines de vacances, cela fait du bien. Je n'ai pas tenu le blog à jour, mais j'ai continué à partager des liens sur Twitter et à faire ma revue de presse quotidienne. A priori je n'ai pas raté grand chose de l'actualité des applications Web pendant ces 2 dernières semaines. Il est maintenant temps de rattraper le retard sur ce blog en commentant les liens les plus importants, ce qui vu le volume se fera en plusieurs posts. Commençons : Forms : un bon tuto plus du code pour faire migrer ses formulaires vers HTML5 en construisant un... Continue reading
Posted Aug 12, 2010 at Brain Cracking
Comment
0
RPW 27/07/10: youtube et HTML5, faire son player video html5, chiffres Web Mobile français, historique de GMail
Revue de Presse Web de hier : Vidéo : Youtube propose son player "embedable" en version HTML5. Il s'agit d'une iFrame incluant une page comme celle-ci contenant le player et ses dépendances, le fallback Flash étant inclus au besoin. Même si le journaliste s'en étonne, car Youtube avait fait un rapport critique (résumé dans cette news) sur son expérience HTML5, il faut tout de même rappeler que cette critique est valable aujourd'hui, et ne le sera plus dans le futur (1 an ?), et que bien peu de sites ont la grille de critères de Youtube. D'autant que ce nouveau... Continue reading
Posted Jul 27, 2010 at Brain Cracking
Comment
1
RPW 26/07/10: tests unitaire AJAX, librairie WebSocket, imprimer des éléments HTML5 sous IE
Revue de Presse Web du WE : Perfs : 2 résumés de la soirée performances : l'un par Zeroload, l'autre par Johan Bleuzen qui a noté quelques points particuliers sur la technique du flush() telle qu'utilisée par Google, ainsi que d'autres détails de la présentation très dense de Stoyan (je suis à peu près sur qu'elle était inédite et qu'il a profité du niveau de la soirée pour se lacher un peu). Tests : outil jQuery permettant de compléter vos tests unitaires et d'intégration en simulant des retours de XHR (dites requête Ajax). Les tests unitaires coûtent très cher pendant... Continue reading
Posted Jul 26, 2010 at Brain Cracking
Comment
0
et j'ai du passer également sur les techniques de pré-chargement des JS, que j'utilise pourtant
inclusion performante de javascript, la mini-conférence
ce site a migré : retrouvez cet article à jour sur braincracking.org Pas de revue de presse ces 2 derniers jours car j'ai du préparer une mini conférence de 20 minutes et les sujets performances demandent énormément de recherches et de validation :) Voici donc mes slides en ligne (PDF ici) de la...
defer/async ne passait pas un critère éliminatoire pour moi : la compatibilité tout navigateur.
pour labJS, c'est peut être une erreur de ne pas l'avoir inclus car outre le chargement non bloquant qui est de toute façon émulable facilement, il permet de gérer les dépendances entre fichiers JS, ce qui demande un peu plus de code, il a donc un intérêt direct pour l'implémenteur.
Au moment de faire mon étude, je ne me souvenais plus qu'il existait, l'ayant éliminé de ma liste parce que je ne m'en servirais jamais : si 2 fichiers dépendent l'un de l'autre, je les concatène ensemble, ce qui n'est pas forcément jouable pour tout le monde ...
mea culpa donc, j'aurais au moins pu le citer.
Sinon je vous ai épargné pas mal de techniques exotiques ou d'autres librairies qui n'apportent rien à l'affaire, pour me concentrer au final sur les difficultés d'implémentation communes à toutes les techniques de lazy-load. En fait si j'avais eu une heure de présentation, ces 20 minutes auraient été ma conclusion :)
60ms pour ton HTML ? voyages-sncf m'a mis 50ms pour un css, tu es largement battu ;)
inclusion performante de javascript, la mini-conférence
ce site a migré : retrouvez cet article à jour sur braincracking.org Pas de revue de presse ces 2 derniers jours car j'ai du préparer une mini conférence de 20 minutes et les sujets performances demandent énormément de recherches et de validation :) Voici donc mes slides en ligne (PDF ici) de la...
RPW 23/07/10: HTML5 et DIV, Node.js sur un multi-thread, introduction performances Web
Revue de Presse Web de vendredi dernier : HTML5 : article sur l'utilisation du tag <div> dans la sémantique HTML5. Dans mon implémentation de l'époque je n'avais pas très bien compris la différence entre <div> et <section>, la raison principale étant que je croyais que <section> ne voulait rien dire. Cet article rappelle donc que ce n'est pas le cas, que non seulement <div> fait toujours partie de la spec HTML5 mais qu'en plus il est recommandé de l'utiliser, notamment pour s'aider à styler la page ou à séparer des parties du markup de manière arbitraire. <section> s'utilise quant à... Continue reading
Posted Jul 26, 2010 at Brain Cracking
Comment
0
@nicolas : merci d'avoir fait un post sur ta migration, tes contraintes de base (passer les validateurs XHTML) sont bien plus fortes que les miennes et c'est donc une lecture assez intéressante.
que je m'empresse de partager sur ma revue de presse d'ailleurs :)
Migrer un site de production vers un markup HTML5
ce site a migré : retrouvez cet article à jour sur braincracking.org A force de couvrir l'actualité du développement web où l'on parle d'HTML5 à peu près tous les jours, on finit par être frustré des démos faites sur des pages qui n'ont pas grand chose à voir avec les contraintes que l'on a en p...
inclusion performante de javascript, la mini-conférence
ce site a migré : retrouvez cet article à jour sur braincracking.org Pas de revue de presse ces 2 derniers jours car j'ai du préparer une mini conférence de 20 minutes et les sujets performances demandent énormément de recherches et de validation :) Voici donc mes slides en ligne (PDF ici) de la soirée performance de hier, organisé par Eric Daspet et hébergé (et alcoolisé) par Octo. L'idée était d'explorer un point particulier des performances Web, le sujet traité ici étant l'inclusion non-obstrusive de JS. Il y a beaucoup de techniques plus ou moins exotiques, au final je vous ai... Continue reading
Posted Jul 22, 2010 at Brain Cracking
Comment
3
RPW 19/07/10: savoir lire un graphique réseau, les fichiers complémentaires des sites, référence Canvas, astuce police
Revue de Presse Web de hier : Perfs : bonne vidéo sur comment lire un graphique réseau généré par webpagetest.org et httpwatch. Gestion : petit listing des fichiers invisibles mais utiles qui accompagnent les sites, et qu'on oublie souvent de maintenir, voir de faire au début d'un site. Il y a bien sur les favicon.ico et robots.txt qu'on ne présente plus, et qui vous éviteront d'avoir des logs plein de 404, mais aussi sitemap.xml qui pointe les moteurs de recherche sur certaines urls (généralement généré dynamiquement), Dublin.rdf qui permet de stocker des metadatas de votre site (ce qui évite de... Continue reading
Posted Jul 19, 2010 at Brain Cracking
Comment
0
RPW 17/07/10: tester le type en javascript, HTML5 version courte, tester le comportement navigateurs face au cache
Revue de Presse Web de ce WE : HTML5 : présentation vidéo ultra courte des nouveautés d'HTML5 (la vraie spec), pas inutile pour montrer rapidement les promesses d'HTML5. On y voit notamment de la sémantique avec des <section> dans des <article> (j'ai mis du temps à quoi servait <section>...) et comment s'utilise <figure> et <legend> pour ajouter une légende à une image. Après sont rapidement passés en revue localStorage, Canvas, audio / video et la communication entre frames. JavaScript : comment tester le type en JS. On se dit typeof est là pour ça, mais comme souvent en JS, ça... Continue reading
Posted Jul 19, 2010 at Brain Cracking
Comment
0
RPW 16/07/10: poids des pages, moteur de jeux en JS, convention de codage JavaScript, intersection de tableau javascript
Revue de Presse Web de hier : Perfs : les pages web sont de plus en plus lourdes, c'est un constat que l'on se fait depuis l'avènement de l'ADSL pour tous en France mais à quel point cela est il grave ? Le markup d'un site populaire comme CDiscount fait 172Ko (normal, tout est à base de <table> ...), mais il ne fait plus que 31Ko une fois gzippé : il est généré et reçu en moins d'une demie seconde, ils ne voient sans doute pas l'intérêt de changer. Et pourtant si l'on ajoute les 15% d'utilisateur à qui l'on... Continue reading
Posted Jul 16, 2010 at Brain Cracking
Comment
0
RPW 15/07/10: paris Web 2010 j'y serais, CSS3 pour IE, Youtube application mobile, remplacer ses icônes par du texte, détecter la langue de l'utilisateur
Rattrapage de la revue de presse Web de cette semaine : Evènement : le programme de Paris Web 2010 est sorti. Très riche avec 38 orateurs, organisée par des passionés, les éditions précédentes ont toujours été d'une très grande qualité, malgré un tout petit prix (250 ou 340, avec les repas). Pour vous donner une idée du succès : un tiers des places a déjà été vendu alors que le programme n'était pas connu (estimation perso en prenant ce chiffre et celui ci), dépêchez vous donc pour passer commande. Cette année étant visiblement l'année de mon coming-out (je blog, je... Continue reading
Posted Jul 15, 2010 at Brain Cracking
Comment
1
RPW 14/07/10: que supporte les mobiles, bénéfices de la performance Web, implémentation de la balise , inclure son JS de manière non obstrusive
Désolé pour le manque de revue de presse de ces derniers jours, mais une petite surcharge de taf s'est imposée à moi. La revue a pu continuer sur Twitter mais je n'ai pas eu le temps de la commenter. Rattrapage : Mobile : tableau comparatif du comportement des navigateurs mobiles (modernes), sur des éléments aussi variés que le support CSS3, l'API Selector, l'interprétation de la spec ECmascript, la sécurité et surtout l'utilisation du réseau : nombre de JS en parallèle, nombre de téléchargement en parallèle par nom de domaine... Bref, cela vous sera utile en particulier concernant les performances réseau... Continue reading
Posted Jul 15, 2010 at Brain Cracking
Comment
0
RPW 07/07/10: étude de cas performances Mappy, Firefox 4b1, déclaration de fonctions en JS, tester simplement et automatiquement son interface
Revue de Presse Web de hier : Browser War : Firefox 4 beta 1 est de sortie, avec un énorme paquet d'améliorations que les webdevs attendaient. Je ne les liste pas ici, Mozilla l'a déjà très bien fait. Comme pour IE9, je recommande d'au moins vous l'installer sur une machine virtuelle pour tester votre site car le parser HTML a changé et les formulaires HTML5 sont (partiellement) supportés. Ne remplacez pas votre FF de travail, la plupart des addons dont firebug ne marchent pas. Update : la version alpha de Firebug marcherait avec cette beta JS : il y 2... Continue reading
Posted Jul 8, 2010 at Brain Cracking
Comment
0
RPW 06/07/10: ergonomie, 15% d'utilisateurs sans gzip, les performances de la home Yahoo
Revue de Presse Web de hier : Ergonomie : le comportement des utilisateurs, à la fois surprenant et frustrant pour les producteurs de sites. J'avais déjà partagé ce lien il y a 4 mois, mais ceci en est un résumé français, et cela ne fait pas de mal à relire tant les résultats sont édifiants. Pour résumer, les gens y vont franchement à l'instinct sur vos pages : scan visuel très rapide, sections entières inconsciemment ignorées, scan des mots, la moindre attente ou sentiment d'être perdu les fait partir, chaque élément doit réagir comme ils s'y attendent eux. Seul salut... Continue reading
Posted Jul 6, 2010 at Brain Cracking
Comment
0
RPW 05/07/10: Canvas pour les flasheurs, installation de Node.js et utilisation de WebSocket,
Revue de Presse Web de hier : Canvas : implémentation d'un algo hallucinant : le "content aware image resizing". L'algo original permet de redimensioner une image sans crop ou déformation, regardez cette démo vidéo ici. Pour le porter sur le Web, l'auteur manipule un Canvas en JS et a apporté de nombreuses améliorations de performances, car c'est très consommateur en CPU. Sa prochaine amélioration sera logiquement d'utiliser Web Workers pour générer l'image afin de ne pas gêner le thread principal. Canvas : librairie JS d'accès à Canvas, qui adopte la syntaxe et les méthodes d'ActionScript. Idéal donc pour le développeur... Continue reading
Posted Jul 6, 2010 at Brain Cracking
Comment
0
ah non peut être pas Alsa : http://www.alsa.fr/
RPW 02/07/10: outils pour l'accessibilité, Flash est accessible, CSS orienté Object et l'exemple Facebook, listing des propriétés CSS3
Revue de Presse Web de ce vendredi : Accessibilité : liste de ressources pour aider à développer de manière accessible. Outre la formation, ce qui vous sera utile au quotidien seront sans doute les extensions FF comme Wave ou Ocawa. Je n'utilise que le premier ainsi qu'un Color Analyzer / rôle...
et moi qui hésitait avec "le Sieur Goetter" (attiré par une rime facile) :/
Raphounet ?
le gars d'Alsa ?
:)
RPW 02/07/10: outils pour l'accessibilité, Flash est accessible, CSS orienté Object et l'exemple Facebook, listing des propriétés CSS3
Revue de Presse Web de ce vendredi : Accessibilité : liste de ressources pour aider à développer de manière accessible. Outre la formation, ce qui vous sera utile au quotidien seront sans doute les extensions FF comme Wave ou Ocawa. Je n'utilise que le premier ainsi qu'un Color Analyzer / rôle...
RPW 02/07/10: outils pour l'accessibilité, Flash est accessible, CSS orienté Object et l'exemple Facebook, listing des propriétés CSS3
Revue de Presse Web de ce vendredi : Accessibilité : liste de ressources pour aider à développer de manière accessible. Outre la formation, ce qui vous sera utile au quotidien seront sans doute les extensions FF comme Wave ou Ocawa. Je n'utilise que le premier ainsi qu'un Color Analyzer / rôle ARIA, très pratique pour discuter avec son designer du manque de contraste. Les validateurs en ligne ne sont pas pratique pour les environnements de développement qui est en principe invisible de l'extérieur (et si vous avez un site avec beaucoup d'interaction, c'est quasi inutile). Sur Alsa on est bien... Continue reading
Posted Jul 5, 2010 at Brain Cracking
Comment
3
RPW 01/07/10: HTML5 sur mobile, IE reprend des parts de marché, sortie d'Opéra 10.6 avec WebM
Revue de Presse Web de hier : HTML5 : série d'articles démontrant l'utilisation d'HTML5 sur mobiles. C'est un peu indigeste à lire en une seule fois, mais pour s'auto-former à HTML5, c'est assez complet, tout en vous donnant les compatibilités par versions majeures de navigateur mobile. Y sont abordé Canvas, CSS3, la géolocalisation, l'offline avec un manifeste de cache, les Web Workers (j'ignorais qu'ils étaient implémentés sur Android et Fennec) et LocalStorage. Browser War : IE a arretté de perdre des parts de marché dans le monde, regagnant même ces 2 derniers mois +0.88% en Europe. Je n'ai pas le... Continue reading
Posted Jul 2, 2010 at Brain Cracking
Comment
0
tiens j'ai retrouvé ce qui m'avait mis le doute : http://www.softwareishard.com/blog/firebug/firebug-http-time-monitor/
l'équipe firebug s'était rendu compte que dans certains cas (UI bloqué), la précision était largement faussée dans le tab réseau, et ils avaient fait ce post en octobre dernier pour dire que c'était fixé, ce qui m'a laissé supposer que le problème pouvait très bien se reproduire dans d'autres mesures.
Mais maintenant Firefox exécute les addons en dehors du thread principal, logiquement ça doit améliorer la précision
Les addons IE eux (dont dynatrace) ne sont pas fait en JS et sont exécutés dans des process à part, ils partent donc mieux pour être plus précis, mais comme je n'ai aucune idée de la manière dont ils accèdent au coeur de IE, ça ne m'avance pas plus, et cette fois ci impossible de trouver l'info sur le Net
RPW 30/06/10: introduction à SVG, CSS display, bilan de Youtube HTML5 vidéo, poids moyen des sites, IE9 WebTiming
Revue de Presse Web de hier : SVG : introduction à SVG. Y sont abordés la syntaxe de base, les outils pour en générer et la compatibilité. L'avantage est de pouvoir générer des images qui ne sont jamais pixelisées (comme Flash) car SVG gère des formes, et de pouvoir manipuler ces formes depuis...
je ne voulais pas faire ce tuto plus long que nécessaire, mais je crois que tu as raison : je vais rajouter au moins le pattern Singleton
Javascript Orienté Objet : syntaxe de base des classes JS à l'intention des développeurs PHP
ce site a migré : retrouvez cet article à jour sur braincracking.org Pourquoi, pour qui ? Ce tuto a pour cible les développeurs qui ont une expérience du PHP (5) et qui veulent se lancer dans un projet Javascript qui dépasse le simple scripting. Cela va donc commencer par savoir écrire des class...
RPW 30/06/10: introduction à SVG, CSS display, bilan de Youtube HTML5 vidéo, poids moyen des sites, IE9 WebTiming
Revue de Presse Web de hier : SVG : introduction à SVG. Y sont abordés la syntaxe de base, les outils pour en générer et la compatibilité. L'avantage est de pouvoir générer des images qui ne sont jamais pixelisées (comme Flash) car SVG gère des formes, et de pouvoir manipuler ces formes depuis JS. Dans les futurs FF4 et IE9 (le reste des navigateurs suivra forcément), il sera possible d'embarquer du SVG directement dans une page HTML5. Il n'y a plus qu'à attendre la disparition d'IE8 ... CSS : petite démo de la propriété display en action, qui montre qu'il... Continue reading
Posted Jun 30, 2010 at Brain Cracking
Comment
2
More...
Subscribe to jpvincent’s Recent Activity