Hi,

I've just received a very interesting mail from facebook developers blog since one hour explaining how to improve html5 performance in games (canvas+css3+javascript).

Main things to remember are :
- For desktop modern navigators ( Chrome 10/9, Firefox 4, IE9 =geeks&chuck norris at this time ) a canvas per object is better.
- But for now, this represents a little part of the mondial internet browsers park, so while waiting for a general up to date versions operation, user DIV tags with background images is better than canvas use.
- My personal tweak is to use the jquery-transform plugin, which has really results on oldIE for rotate and scales css3 replacement.
- Use webkit transitions for IOS games, javascript in desktop browsers to animate DOM ( absolute position )
- And finally for me, last advice was to use individuals sprites rather than one for all objects ( sprites images must be small to have better performances in cut )

So here now, the complete facebook blog post can be read here : http://developers.facebook.com/blog/post/460

Patator but what's this ? Patator is my first experience in social gaming made in HTML5 and to be more precise, in canvas and jQuery.
So I made for this the alpha version of a canvas gaming engine.

Sure this one has to grow, and gain in frame rate performance, but I think it's a good start to work on an open source HTML5 Gaming Framework.

For moment, Game is not avalaible on IE

Un petit billet pour vous signaler que mon dernier bébé est sorti ce matin : www.socialmixmedia.fr.


C'est le site vitrine de l'agence Web spécialisée sur les Médias Sociaux pour laquelle je travaille en tant que Freelance.

Alors n'hésitez pas à nous contacter pour toute question sur le SMO (Social Media Optimization) afin d'améliorer votre visibilité sur les réseaux sociaux comme facebook, twitter, linked...
=> On commence à avoir une bonne expérience et de solides contacts

Rejoignez-nous sur facebook : Devenez Fan !
Compte twitter : Suivez-nous !
Linkedin : Rejoignez-nous !

Je tenais à vous présenter ma première application développée pour facebook qui se présente sous la forme d'un Quizz avec un timer pour chaque question. Tout ça sur le thème du sport !

Le FrontEnd est en FBJS + jQuery et le backEnd, c'est une api en PHP.

Elle comporte des outils de viralisation comme les Social Plugins "I Like" / "Invite your friends" / "Facepile"..., un classement mondial, la tenue de stats, Facebook Connect...


L'application est sortie officiellement aujourd'hui et validée sur le apps dir de facebook.
Je vous tiendrais au courant de l'évolution des stats et le phénomène de propagation.

On croise les doigts pour que ça prenne !

D'ailleurs si vous voulez tester vos connaissances ou voir à quoi ressemble cette application et analyser les différents mécanismes (authentification/publication...), cliquez-ici : Le Grand Quizz du Sport sur Facebook

Si vous souhaitez en savoir plus sur comment telle ou telle chose : faites moi signe :)

Bye.

Ping.fm est un service qui permet, à partir d'une seule et unique interface, de publier automatiquement un nouveau billet sur une multitude de services de micro-blogging.

On peut ainsi nommer : Twitter, Facebook ou encore Delicous dans les service supportés.

C'était déjà bien sympathique bien sur, mais ils ont encore fait plus fort ! Maintenant, on associe un Flux RSS à notre compte Ping.fm et dès que l'on publie un billet, il se retrouve dans le flux RSS et pouf : également sur Twitter, facebook et compagnie.



Je vais justement tester cette fonctionnalité avec ce nouveau post.
Et pour rappel, si vous voulez suivre les news de Web2ajax sur twitter, c'est par ici : http://twitter.com/Web2ajaX

Je vous laisse essayer tout ça :)

Vous le savez, jQuery est génial, c'est la classe américaine ce truc et cependant, j'avais encore un soucis avec des requetes ajax synchrone qui bloquaient le navigateur le temps du retour de la réponse et quand cette requête est exécutée toutes les 10 secondes et que le browser est bloqué 2s sur les 10s, ça le fait pas trop...

Et bien j'ai la solution et elle se nomme 'jsonp'.


But What is 'jsonp' ? JSONp c'est du json et le 'p' pour 'padding' (formatage). Cette technique est utilisée par de nombreux gros voir très gros comme google, yahoo ou facebook...

Dans l'idée, celà permet d'effectuer une requete ajax en GET asynchrone (donc ne bloque pas le navigateur) et quand la réponse est disponible, jQuery créait une fonction javascript tempraire (callback) qui sera exécutée en passant le json en paramètre.

Vous allez voir, c'est dans simplicité angélique :

1. La requête jQuery :

[sourcecode language='js']
jQuery(document).ready(function() {
// To manage ajax req and be able to abort one
var ajax_req = {} ;

// The refresh function
var refresh_div = function() {
if ( ajax_req.refresh_div ) ajax_req.refresh_div.abort() ;
ajax_req.refresh_div = jQuery.ajax({
type: 'GET',
url: '/url_to_the_page/',
cache: false,
async: true,
dataType: 'jsonp',
success: function(data) {
// Request is complete and returned a json result
console.log(data) ;
}
});
}

// The updater dameon every 10 seconds
if ( timer_d ) clearInterval(timer_d);
timer_d = setInterval(function() {
refresh_div() ;
}, 10000) ;
});
[/sourcecode]

2. La page en php qui va recevoir la requete ajax et produire le json

[sourcecode language='php']

[/sourcecode]

distributed raman amplifier3. A ce point, tout est fini ou presque et jQuery fera le reste en exécutant le callback 'success' de la requete ajax.

Voilou, j'espère avoir pu vous aider quelque peu.
Attention tout de même, il vous faut au minimum jquery 1.2.1 et comme je n'ai que des navigateurs à jour, je ne sais pas ce que ça donne sur des navigateurs comme IE6...

FaceBook Autosuggest Like is a powerful jQuery plugin to transform an input field into a real time autocompletion search engine, designed like facebook one.

This plugin require jQuery libs and the autocompletion plugin 'Bsn Autosuggest".

On custom side, make an ajax request and build search plugins to categorize your results.

Features :
- Autocomplete and ajax support
- Database search
- Support search plugins
- Support cache
- Cross Browser support ( IE > 5.5, FireFox, Safari, Opera )

I let u see the demo...
Have Fun !