text-renderingOmaisuus CSS voit valita laadun tekstin uudestaan nopeuden (tai päinvastoin), jolloin voit hienosäätää optimoinnin ehdottamalla selaimen siitä, miten se pitäisi tehdä tekstiä ruudulla. Sanoi toisen tavan MDN: ssä:
text-renderingCSS omaisuus on tietoja renderoija mitä optimoida kun tekee tekstiä. Selain tekee kompromisseja nopeuden, luettavuuden ja geometrisen tarkkuuden välillä.
Näet joitain esimerkkejä ennen / jälkeen. Joskus tulos on suoraan ylöspäin parempi kerning:
Jotkut kirjasintiedostot sisältävät lisätietoja siitä, miten kirjasin tulisi renderoida. optimizeLegibilitykäyttää näitä tietoja, mutta optimizeSpeedei.
Esimerkki
p.legibility ( text-rendering: optimizeLegibility; ) p.speed ( text-rendering: optimizeSpeed; )Esitys
Kun sanotaan, että nopeuden ja tarkkuuden välillä on kompromissi, he eivät ole tosissasi. Huomioon voi tulla merkittäviä suorituskykyongelmia. Tuo artikkeli on syytä lainata kokonaan:
Mobiililaitteissa on tosiasiallisesti merkittäviä, tosiasiallisesti kohtalokkaita suorituskykyongelmia (kuten 30 sekunnin latausaikoja tai pidempiä), kun optimizeLegibility-sovellusta käytetään pitkille sivuille. Käytä sitä vain, jos tiedät, mikä on tekstin enimmäispituus. (Vältä myös sen käyttöä Android-asiakkaille, ainakin vanhemmissa versioissa, joita kaikki edelleen käyttävät: sen kirjasimen renderöijässä on usein hyvin outoja vikoja, kun tämä tila on käytössä.)
Tein joitain testejä Instapaperin kanssa arvioidakseni likimääräiset optimizeLegibility-suorituskykyrajat. Esimerkiksi Instapaper for iOS -sovelluksen 5000 sanan artikkeli käyttää optimizeLegibility-ominaisuutta vain laitteissa, joissa on A5-luokan tai korkeampi suoritin. Vanhempien iOS-laitteiden ongelmien välttämiseksi en suosittele optimizeLegibility-sovelluksen käyttöä sokeasti ja ehdoitta millä tahansa yli 1000 sanan pituisella sivulla. Enkä suosittele sen ottamista käyttöön Androidissa ollenkaan.
On houkuttelevaa tehdä:
/* Probably not advisable */ body ( text-rendering: optimizeLegibility; )Mutta ole varovainen siitä, se näyttää vaaralliselta varsinkin, kun sitä käytetään mielivaltaiselle sivulle.
Selaimen tuki
| Kromi | Safari | Firefox | Ooppera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 4+ | 5+ | 3+ | Ehkä Blinkin jälkeen? | Ei | 2.3+? | 3+? |
On olemassa erilaisia vikoja. Android-ongelma uusilla linjoilla. Chromella on erilaisia, myös kirjainten väli. Safari (ja muut) oletusarvoisesti optimoi nopeuden pikemminkin kuin määrittelee lennossa.