Quel est l'état actuel de la précision des sous-pixels dans les principaux navigateurs?

je travaille sur une application de dessin qui exige des niveaux élevés de précision, et je me demande laquelle des principales plateformes de navigateur (y compris L'élément HTML Canvas, et Flash) donne la meilleure précision de mise en page sous-pixel, à la fois pour les éléments dessinés (rectangles dans la toile ou Flash, DIVs absolument positionnés dans le navigateur), et pour le texte.

Il ya un certain nombre de messages liés à ce, à la fois sur ce site et d'autres, (voir la liste en bas), mais beaucoup sont tout à fait vieux, et aucun ne résume la situation actuelle.

ma compréhension est que Flash a le support natif pour le positionnement sub-pixel, en utilisant twips pour positionner des objets à un vingtième d'un pixel, et que lorsque le cadre Textlayoutframe est utilisé, cette précision s'étend aussi au texte. Il y a au moins un rapport, cependant, que cela ne fonctionne pas correctement dans Chrome. Quelqu'un peut-il confirmer cela?

ma compréhension de la situation dans les navigateurs est que Firefox 14 + supporte le positionnement de sous-pixels pour le texte et les éléments dessinés, à la fois dans la mise en page et dans la toile, mais je n'ai pas été en mesure de déterminer à quel point c'est exact.

je comprends que Chrome (à partir de v21) ne supporte pas du tout le positionnement des sous-pixels.

je comprends IE9 ne prend pas en charge les sous-pixels de positionnement, mais il apparaît à partir de la MS blog en lien ci-dessous que IE10 volonté.

Je ne sais pas s'il y a une variance Mac/PC dans cela, et je ne sais pas si la précision de Flash varie entre les plates-formes et/ou les navigateurs.

je comprends qu'une question sommaire comme celle-ci puisse provoquer un débat, mais je crois que c'est assez spécifique pour que les gens puissent fournir des réponses utiles, et j'espère que ce fil peut être une référence pour l'état de la précision de positionnement jusqu'à présent.

Quelques références:

http://blogs.msdn.com/b/ie/archive/2012/02/17/sub-pixel-rendering-and-the-css-object-model.aspx

Sub-pixel rendering en Chrome Toile

http://johnblackburne.blogspot.co.uk/2011/11/twips.html

http://ejohn.org/blog/sub-pixel-problems-in-css/

Sous-Pixels de positionnement CSS

https://productforums.google.com/forum/?fromgroups=#!topic / chrome / pRt3tiVIkSI

37
demandé sur Community 2012-09-14 15:35:19

2 réponses

Actuellement, vous pouvez vous attendre à ce que la meilleure prise en charge des arrondis et des sous-pixels Vienne de Mozilla avec IE comme finaliste. IE pourrait être plus affiné, mais leur libération cycles sont tellement longue que Mozilla est susceptible de rester en avance sur eux.

en ce qui concerne la mise en page des sous-pixels, il se peut que vous chassiez un wisp, car l'avantage des sous-pixels améliore les problèmes d'anti-aliasing, et non la précision de la localisation de l'écran. Votre image ne sera jamais plus précise que 1 pixel de la vraie position, indépendamment de la prise en charge du sous-pixel.

la raison pour laquelle certains navigateurs ne zooment pas correctement n'a rien à voir avec le support des sous-pixels, c'est qu'ils ne se souviennent pas de la position exacte et de l'arrondissement correctement. En d'autres termes, ils arrondissent prématurément la position et cela provoque un mauvais alignement de l'image.

10
répondu Tyler Durden 2012-09-18 19:59:05

brève réponse:

Aucun. Cela n'est pas possible / documenté.

Et même si elle est déterminée expérimentalement, elle n'est pas garantie de rester la même à l'avenir.

longue réponse:

Pour des précisions inférieures au pixel, il y a beaucoup de variance entre les navigateurs/OS/HW sur la façon dont l'entrée est capturée/rendue. Avec l'accélération h / w étant activé sur la plupart des navigateurs modernes, il existe un grand nombre de variations dans le rendu entre les différents PC qui utilisent différents navigateurs sur différents systèmes d'exploitation. Tant et si bien qu'il est même possible d'identifier chaque utilisateur unique par les variations légèrement différentes dans la sortie rendue d'un échantillon commun .

plutôt que de s'inquiéter des écarts dans les cadres sous-jacents, Que Diriez-vous de concevoir L'UI de votre application de dessin à être indépendant de ces problèmes. Deux méthodes auxquelles je peux penser en ce moment sont:

  1. permet d'éditer l'image à des niveaux agrandis.

  2. la Conception d'un snap-to-grid méthode des éléments.

mise à jour:

L'opération" zoom " serait votre mise en œuvre personnalisée et non une caractéristique des cadres sous-jacents. Ainsi, si vous avez besoin d'une précision de sous-pixel de l'ordre de 1/10 d'un pixel, il vous faudrait un 10x_zoom() implémenté dans votre application web qui rendrait les données de

1er pixel --> 10x10pixels à (0,0),

2ème pixel --> 10x10pixels à partir de (11,11).

de cette façon, on aurait une vue très agrandie des données, mais le cadre est parfaitement ignorant de tout cela et rend précise à l'écran-pixel (qui dans notre cas est maintenant 1 / 10ème du pixel d'image).

il est également important de noter que cette opération consommerait beaucoup de mémoire si elle était faite pour l'image entière à la fois. Par conséquent, faire cela uniquement pour la partie visible de l'image dans une "fenêtre de zoom" serait plus rapide et un processus moins intensif en mémoire.

une fois mis en œuvre dans votre Web-app de dessin les inexactitudes de sous-pixel dans les cadres pourraient ne pas se révéler être un problème pour l'utilisateur comme il peut toujours basculer dans ces modes et fournir des entrées précises.

2
répondu TheCodeArtist 2012-09-20 10:41:20