no.hideout-lastation.com
Paradis For Designere Og Utviklere


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.

Nettlesermotorer

Blink 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

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

(Tekniske og design tips)

Alt du trenger å vite om Abonner med Amazon

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

(Tekniske og design tips)