Rendement de sous-pixel dans Chrome Canvas

Réponse courte: Non. Non possible

C'est l'un des deux sujets qui frustre beaucoup d'utilisateurs de Canvas.

Le rendu de Subpixel / anti-aliasing de n'importe quel type dépend du navigateur. Cela signifie que les différents navigateurs sont enclins à rendre les choses de différentes façons.

Beaucoup de gens ont demandé que l'anti-aliasing soit une option qui peut être activée ou désactivée pour un contexte spécifique. Pas de chance de rien comme ça encore.

Chrome en particulier, vous devrez garder un œil, car la manière dont ils ont traité le rendu de sous-pixels a considérablement changé au cours des 4 derniers mois. Si vous commencez à utiliser la chaîne de développement Chrome, vous obtiendrez un aperçu des choses qu'ils continuent à essayer. Ils ont fait un certain nombre de tests dans ce domaine, et ont même poussé des changements régressifs drastiques dont je m'en suis plaint.

L'endroit à emporter ici est le suivant:

1. Chrome est certainement «pas encore fini» en ce qui concerne le rendu de sous-pixels. C'est une mauvaise idée, mais votre meilleure option pour l'instant est d'attendre un moment.
2. La spécification doit être beaucoup plus spécifique dans ce domaine, donc il existe une certaine cohérence entre les navigateurs, car tout rendu / anti-aliasing de sous-pixel en tout cas est très dépendant du navigateur. Il y a eu une discussion non résolue en 2008. Je ne suis pas loin de tout progrès depuis.

Je ne crois pas que cela soit possible actuellement.

C'est un problème difficile parce que la toile fournit tant de contrôle de bas niveau à l'utilisateur. Si la toile commence à faire des choses intelligentes comme celle-ci, il pourrait rompre certaines autres fonctionnalités que l'utilisateur attendait.

Considérez le rendu du sous-pixel pour d'autres éléments graphiques – selon l'application, le programmeur peut ne pas vouloir, et vous ne voudrez certainement pas que le rendu de sous-pixels soit activé arbitrairement pour l'ensemble de l'élément en tant que proposition de tout ou rien. Imaginez obtenir la couleur d'un pixel spécifique – quelle est la bonne réponse ici? Si la toile est en ligne, renvoyez la couleur attendue ou renvoyez la couleur réelle (alors nous devons répondre aux questions tout au long de la journée sur SO pour "pourquoi ce pixel fait-il que le noir soit mesuré comme rouge foncé?").

Certains diront que Firefox fait la mauvaise chose ici.

Voici une façon de faire un rendu de sous-pixel pour tout contenu de toile (texte, images, vecteurs, etc.). http://johnvalentine.co.uk/subpixel-html5-canvas.htm .

Aperçu de la méthode

Il s'inspire d'une toile, qui est ensuite dessiné sur l'écran pour profiter des sous-pixels à rayures RVB. Il fonctionne aussi avec les canaux alpha. Notez que cela pourrait ne pas fonctionner si vous utilisez un affichage portrait, des pixels non rayés ou si votre navigateur affiche des toiles à une résolution inférieure à celle de votre écran.

Il est possible d'affiner, mais c'est un gros gain pour une méthode simple. Il fonctionne sur tous les navigateurs que j'ai testés, mais uniquement lorsque le ratio de pixels en toile sur écran est de 1: 1 (mais je crois que des solutions ont été proposées pour cela).