Testing SVG-støtte over nettlesermotorer [Case Study]
SVG (Scalable Vector Graphics) støttes offisielt av alle de viktigste nettleserne, inkludert Internet Explorer. Støtten spenner inn i et bredt spekter av bilderedigeringsprogramvare, spesielt Inkscape, som bruker SVG som sitt opprinnelige format (Hvis du vil ha en oppdatering på SVG, klikk her).
Men hva støttes nettlesere nettopp? Vis alle gjengivelsesmotorer SVG-filer og deres funksjoner på samme måte? Og hva med deres avanserte funksjoner som filtre? Vel, det er det vi skal finne ut av. Vi tok et utvalg av moderne nettlesere, inkludert noen av de mindre beryktede, og testet dem med en SVG-fil laget for dette formålet .
Testbildet
Vi forberedte vårt testbilde med fokus på elementer som artister mest sannsynlig bruker. Blant de testede funksjonene er: tekstbaner og deres interaksjoner, gradienter, gaussisk sløretfilter og til slutt et avansert komposittfilter stablet fra flere filtertyper.
NettlesermotorerBlink motoren
Vi startet med - uten tvil den vanligste gjengivelsen - Blink. Blink er den innfødte motoren for Googles Chrome- og Chrome-nettlesere, Opera og Android WebView. Alle de ovennevnte nettleserne gjør testing av bilder på samme måte på tvers av de testede plattformene.
Sammenlignet med det opprinnelige bildet produsert av Inkscape var det ingen problemer bortsett fra en liten forskjell i gjengivelsen av stablede filtereffekter.
Nettleser | Versjon | Plattform | Resultat |
krom | 43.0.2357.125 | Linux | |
Opera | 30.0.1835.59 | Linux | |
Opera | 30.0.1856.93524 | Android | |
Opera | 30.0.1835.88 | Windows | |
Chrome | 38.0.2125.114 | Android | |
Chrome | 43.0.2357.130 | Windows | |
Lommelykt | 39.0.0.9626 | Windows |
Webkit motor
I følge de siste nettleserdatastatistikkene tilhører de tre øverste posisjonene ikke webkitbaserte nettlesere (fra mai 2015). Denne motoren er imidlertid utbredt blant utviklere. Futhermore er det ulike implementeringer og gafler av det
Alle testede nettlesere gjengitt vår SVG-fil uten problemer; Likevel ble forskjeller i gjengivelsen av Specular Lighting, en sammensatt filterkomponent, observert i forhold til Inkscape.
Nettleser | Versjon | Plattform | Resultat |
Safari | 8.0.6 | Mac os | |
Otter | 0.9.05 | Linux | |
QupZilla | 1.8.6 | Linux | |
QupZilla | 1.8.6 | Windows | |
delfin | 10.3.1 | Android | |
Konqueror | 15.04.2 | Linux | |
UC Browser | 10.5.0.575 | Android |
Trident motor
Trident er en proprietær motor som brukes av Internet Explorer versjon 4.0 - 11.0. IE tolket vårt SVG perfekt. Dessuten matcher komposittfilterutseendet det opprinnelige bildet best. Vi testet også IE 9, den nest mest brukte IE (fra mai 2015) og fant at denne versjonen hadde problemer med gaussisk uskarphet og komposittfilter.
Dette er imidlertid ikke en overraskelse, da IE 9 først ble utgitt før det endelige utkastet til SVG 1.1 SE standard, der filtereffekter ble offisielt lagt til.
Nettleser | Versjon | Plattform | Resultat |
DVS | 11.0.9600.17843 | Windows |
Nettleser | Versjon | Plattform | Resultat |
DVS | 9.0.8112.16421 | Windows |
Gecko motor
Gecko er en motor utviklet av Mozilla Corporation og brukes dermed i Firefox nettleser eller Thunderbird e-postklient. Den brukes også av nettlesere PaleMoon, Waterfox og mange andre gafler fra tidligere Firefox-versjoner. I tilfelle av Gecko-motoren var resultatene ikke akkurat de samme på forskjellige plattformer.
Windows-versjonen viste en liten glitch i å gjengi teksten langs banen; Det samme problemet ble observert i både Firefox og PaleMoon nettlesere. På samme måte som Webkit, synes Gecko å ha problemer med korrekt gjengivelse av Specular Lighting filter primitive.
Nettleser | Versjon | Plattform | Resultat |
Firefox | 38.0.5 | Linux | |
Firefox | 38.0.5 | Android | |
PaleMoon | 25.5 | Android |
Nettleser | Versjon | Plattform | Resultat |
Firefox | 38.0.5 | Windows | |
PaleMoon | 25.5 | Windows |
Problematiske nettlesere
Som det fremgår av ovenfor, har alle nyere versjoner av større gjengivelsesmotorer / nettlesere bestått vår test uten betydelige vanskeligheter. La oss sjekke ut de som ikke gjorde det så bra.
Maxthon er en nettbasert nettleser utviklet i Kina. Ifølge Fahad Khans 20 alternative nettlesere for Windows bruker Maxthon både Trident og Webkit-motorer. Vi har ikke lagt merke til noe problem med SVG-rendering på Linux (v. 1.0.5.3) og Windows (vers. 4.4.5.3000); Men på en Android-enhet ble det ikke gitt gaussisk uskarphet eller andre filter-primitiver.
CM Browser utført raskt på vår testing Samsung Galaxy S3-enhet, men det støtter heller ikke noen av filtereffektene beskrevet i SVG 1.1 SE-spesifikasjonen.
Nettleser | Versjon | Plattform | Resultat |
Maxthon | 4.4.6.2000 | Android | |
CM Nettleser | 5.1.94 | Android |
Konqueror er en standard nettleser for KDE, en av de mest populære Linux-skrivebordsmiljøene. Evnen til å gjengi SVG-filer i Konqueror avhenger av gjengivelsesmotor. Med WebKit aktivert ble testen SVG gjengitt riktig. Konquerors standardgengivelsesmotor, KHTML, ser imidlertid ut til å mangle støtte fra flere funksjoner: Filtereffekter blir ikke brukt på underliggende objekt og slår slutmarkører, og tekst langs sti eller mønsterobjekter blir ikke gjengitt i det hele tatt.
Nettleser | Versjon | Plattform | Resultat |
Konqueror KHTML | 15.04.2 | Linux |
Konklusjon
I vår test fokuserte vi på støtte av SVG-format på tvers av moderne webgjenvinningsmotorer. Vi testet 4 hovedgengivelsesmotorer og 15 forskjellige nettlesere, inkludert populære som Maxthon eller Dolphin. Nesten alle nåværende versjoner av nettlesere har gått gjennom vår test, og det er vanskelig å velge en endelig vinner.
Det ser ut som at støtte og korrekt stabling av filterprimitiver er den siste gjenværende utfordringen for dagens rendering motorer. Når vi sammenligner vårt opprinnelige SVG-bilde med alle de gjengitte resultatene, nominerer vi subjektivt IE 11 (Trident-motoren) til første plass.
Det er imidlertid klart at Blink-motoren er i umiddelbar nærhet, og derfor anbefaler vi Blink-baserte nettlesere for å gjengi SVG-filer. Hvis du vil utføre rask test av din egen favoritt nettleser, kan du gjerne bruke vår SVG renderer testside her.
Redaktørens notat: Dette innlegget er skrevet for Hongkiat.com av Michal Rost. Michal jobber som programmør i et biomedisinsk selskap, men bruker sin fritid til utvikling av open source apps og non-profit webportaler. Han er grunnleggeren av scalablegfx. Du kan finne ham på Twitter.
Bruk nye Android-temaer enkelt med Themer
Android har alltid vært kjent for å være tungt tilpassbar, men mengden arbeid som trengs kan noen ganger være skremmende. Å måtte lete etter og installere egendefinerte ikoner, kan starte temaer og widgets være mye arbeid og ta bort det gøy å faktisk tilpasse Android-enheten din.Hvis du alltid har ønsket å tilpasse Android-startskjermen utover bare å endre bakgrunnen, men aldri hatt tid eller energi, kan Themer bare være appen for deg. Themer er e
Alt du trenger å vite om Abonner med Amazon
Etter å ha tilbudt bøker, musikk, filmer og til og med online-servere, blir Amazon klar til å rulle ut enda et tilbud til sin stadig voksende portefølje: abonnementer .Helt kalt Abonner med Amazon, håper nettbutikkens siste venture å være one-stop-butikken for alle dine online abonnementsbehov . Her e