text-renderingVara CSS võimaldab valida kvaliteedi teksti üle kiirus (või vastupidi), mis võimaldab teil häälestada optimeerimine soovitades brauseri, kuidas see peaks andma teksti ekraanil. MDNis ütles teine viis:
text-renderingCSS vara annab teavet renderdamismootorit mida optimeerida teisendamisel teksti. Brauser teeb kompromisse kiiruse, loetavuse ja geomeetrilise täpsuse vahel.
Näiteid enne / pärast näiteid leiate siit. Mõnikord on tulemus lihtsalt parem, parem:
Mõni fondifail sisaldab lisateavet fondi renderdamise kohta. optimizeLegibilitykasutab seda teavet ja optimizeSpeedmitte.
Näide
p.legibility ( text-rendering: optimizeLegibility; ) p.speed ( text-rendering: optimizeSpeed; )Performance
Kui öeldakse, et kiiruse ja täpsuse vahel on kompromiss, ei tee nad nalja. Võib kaaluda olulisi jõudlusprobleeme. See artikkel väärib tsiteerimist täielikult:
Pikkade lehtede jaoks optimeeriLegibility kasutamisel on mobiilseadmetes tegelikult märkimisväärseid, tegelikult surmaga lõppevaid jõudlusprobleeme (näiteks 30-sekundilised laadimisviivitused või kauem). Rakendage seda ainult siis, kui teate, milline on teksti maksimaalne pikkus. (Samuti vältige selle kasutamist Android-klientide jaoks, vähemalt vanemates versioonides, mida kõik endiselt kasutavad: selle režiimi lubamisel on selle fondirenderdajal sageli väga imelikke vigu.)
Tegin Instapaperiga mõned testid, et määrata ligikaudsed optimalLegibility toimivuspiirangud. Näiteks 5000-sõnaline artikkel Instapaperis iOS-i jaoks kasutab optimalLegibility funktsiooni ainult seadmetes, millel on A5-klass või suurem protsessor. Vanemate iOS-seadmete probleemide vältimiseks ei soovitaks ma pimesi ja tingimusteta optimeeridaLegibility igal lehel, mis on pikem kui umbes 1000 sõna. Ja ma ei soovitaks seda Androidis üldse lubada.
On ahvatlev teha:
/* Probably not advisable */ body ( text-rendering: optimizeLegibility; )Kuid olge selles suhtes ettevaatlik, tundub ohtlik, eriti kui seda kasutatakse meelevaldsel lehel.
Brauseri tugi
| Chrome | Safari | Firefox | Ooper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 4+ | 5+ | 3+ | Äkki pärast vilkumist? | Ei | 2.3+? | 3+? |
Vigu on erinevaid. Androidi probleem uute ridadega. Chrome'is on erinevaid, sealhulgas tähevahed. Safari (ja teised) on vaikimisi optimeerinud kiiruse, selle asemel, et lennult määratleda.