J’essaye de regrouper sur cette page les limitations que j’ai pu trouver en testant Opéra mini sur l’iPhone sur le site dont j’ai la charge (site communautaire très orienté JS). Je ne suis probablement pas le seul à le faire, d’autres comme quirksmode en ont même fait leur métier. Si vous faites des sites pour mobile, ça ne vous intéressera sans doute pas car vous connaissez probablement déjà ces limites. Si vous êtes un développeur de site/application web pour browser desktop, et que vous commencez à vouloir prévoir le même site sur browser touchscreen, ceci vous intéressera.

Je pars du principe arbitraire que vous êtes dans le cas général où jusqu’ici vous ne vous intéressiez qu’à l’iPhone (70% de PDM en France), que vous vous demandez sérieusement si votre site pourra passer sur l’iPad et que vous vous êtes rendu compte que Opéra mini réprésente 50 millions d’utilisateurs dans le monde. Et que vous possédez bien sur un iPhone qui du coup pourra vous servir de plateforme de test à pas cher :)

Voici donc les limites par rapport à Safari :

  • Pas d'event ontouchstart, ontouchmove ou ontouchend, introduits par safari iPhone. Ce n'est certes pas un standard (voir cet excellent tableau de compatibilité de quirksmode), mais concrètement les librairies JS qui proposent le drag & drop (déplacer des objets, faire un slider) aujourd'hui le font sur la base des events onmousedown, onmouseover et onmouseup, qui correspondent quasi littéralement aux events ontouch*. Sous Opéra il n'y a pas l'un et l'autre est biaisé, donc pas de drag & drop ou de slider. Dans mon cas, la galerie ne marche pas en slidant avec le doigt, il faut cliquer sur un bouton pour aller à la photo suivante.
  • pas d'implémentation de manifest.cache (valable sous safari iPhone et Firefox 3.5+), qui permet de déclarer ce dont l'application a besoin en mode offline et qui peut s'utiliser pour avoir un caching hyper agressif, qu'il faut certes apprendre à gérer (on peut se retrouver avec des JS en version 1.2 alors que le site est passé à la version 1.3 par exemple), mais qui permet une rapidité sans pareil, quasi vitale en situation de mobilité
  • aucun support des nouveaux types d'input (url, email, tel ...), là où Safari change le clavier par défaut, ce qui est bien pratique. Bizarrement Opéra Desktop est en avance depuis longtemps sur les autres browsers sur ce point là, mais ils ont du se dire que les développeurs ne l'utilisaient pas assez

Les même limites qu’avec Safari (par rapport à un desktop) :

  • Pas de flash ou de java, rien d'étonnant mais on peut toujours rêver
  • l'upload de fichiers n'est pas possible, comme sur safari, sauf que je n'ai pas trouvé de moyen de le détecter, je ne peux donc pas afficher un message alternatif. Pour info, pour le détecter sous Safari je procédais à ce test. Si vous pensez à une autre manière de tester, je prends ...
  • les overflow:scroll ne sont pas gérés (pas de scrollbar ni même de scroll possible). Il faut donc que rien d'essentiel n'en dépende
  • il n'y a pas d'équivalent au media query de Mozilla -moz-touch-enabled, ce qui aurait été bien pratique pour gérer une alternative au point précédent
  • il ne répond pas au media selector @media handheld. Dommage, on peut dire que ce standard est mort

Les bons points similaires :

  • Il répond au media queries utilisées aujourd'hui pour cibler iPhone Safari : @media only screen and (max-device-width: 480px) { ../.. }. Pratique mais ces media selector ne sont pas viables à long terme s'ils ne sont utilisés que pour ciber des téléphones plutôt que des capacités !
  • canvas est supporté (et marche)

Quelques avantages (majeurs) :

    • Opéra a une innovation majeure qui consiste à posséder des serveurs relais qui vont compresser les pages demandées et les streamer (pas d'aller/retour HTTP classiques) vers le browser. C'est complètement adapté aux réseaux 3G et même Edge de mauvaise qualité, et on peut observer des temps de chargement 3 fois plus rapide sur un réseau de qualité moyenne.
    • Je n'ai pas de chiffres, mais Opéra gère son cache de manière "normale", par rapport à Safari iPhone qui a un cache avec des limitations qui le rendent pratiquement inutile. En conséquence, si vous avez déjà une politique de caching des assets efficace sur browser desktop, elle s'appliquera très bien sur Opéra (ce qui n'est pas le cas de Safari)

    Espérons que Fennec saura faire mieux :)