Share
Den 7. juni utgav Apple en oppdatering til nettleseren, Safari 5. Den inneholder en mengde nye funksjoner for webutviklere, blant annet en raskere JavaScript-motor, bedre HTML5-støtte, utvidelsesstøtte og en flott Web Inspector-oppdatering. Vi vil utforske hva disse nye funksjonene betyr for webutviklere.
En god nettinspektør er ekstremt viktig for de fleste webutviklere. Mange foretrekker fortsatt Firebug, som er en utvidelse for Firefox, men Webkit inspektøren har forbedret seg dramatisk de siste årene.
I Safari 5 har nettinspektøren blitt forbedret CSS inspektør panelet, som lar deg hoppe direkte til en regeldefinisjon i kildefilen.
De DOM inspektør er mye bedre, og lar deg nå legge til attributter til DOM-noder i dokumentet, fjerne nodene og redigere noder som HTML, som lar deg redigere hele taggen som om den var en kildefil.
De Ressurspanel er også forbedret, slik at du får se alle HTTP-omdirigeringer, sammen med fulltekstinformasjon, inkludert HTTP-statuskoden.
De JavaScript inspektør Nå kan du deaktivere alle bruddpunkter med ett enkelt klikk, og hvis du svinger over et element mens du er på et brytepunkt, kan du se de faktiske objektverdiene av det du svinger over. Dette vil være svært nyttig for feilsøkingsformål!
Safari 5 har nå a nytt tidslinjepanel, som gir informasjon om alt som nettleseren gjør mens du surfer. Dette inkluderer lasting av data, analyse av det, legging av det på skjermen og gjengivelse av det. Veldig kul for å jobbe med ytelsen til nettstedet ditt eller programmet.
Et annet lagt panel er Revisjonspanel, som mye som de populære YSlow- og Google Page Speed-utvidelsene for Firebug, foreslår måter for deg å forbedre ytelsen og kompatibiliteten til nettstedet ditt.
Den siste endringen til Web Inspector er at et eget panel for JavaScript-konsoll har blitt skapt. Dette er fint fordi det tillater konsollen å ta opp hele høyden på Web Inspector snarere enn den lille delen som den pleide å. Den er fremdeles tilgjengelig på den gamle plasseringen, men for overkommelig tilgang mens du ser på et annet panel. For mer informasjon om oppdateringene til Web Inspector, sjekk ut dette innlegget på Webkit bloggen.
Apple touts sytten nye HTML5-funksjoner i Safari 5, og du har kanskje hørt om deres HTML5-presentasjon som de lanserte forrige uke (det inneholder virkelig mer CSS3 enn noe annet, men det ser ut til å bli klumpet under HTML5 også!). Apple ser virkelig ut til å skyve HTML5, og Safari 5 har nå en score på 136 på html5test.com, som er opp fra 113 i forrige utgave. Noen av de nye HTML5-funksjonene i Safari 5 inkluderer:
Sjekk ut hele listen nedenfor.
Safari 5 inneholder to nye HTML5-funksjoner for realtime webapps, som Friendfeed og Twitter. WebSocket er den første, og EventSource er den andre. Nå som tre av de store nettleserne, Firefox, Chrome og Safari har implementert WebSocket-spesifikasjonen, skriver realtime webapps ved hjelp av noe som Node.js for en backend blir mye mer gjennomførbart.
WebSocket er i hovedsak en toveiskommunikasjonskanal mellom webappen din i nettleseren og serveren.
Siden det er to måter, kan du skrive noe som en Twitter-klient som bruker den, og nye Twitter-meldinger vises automatisk som de blir presset fra serveren, og også skyve nye tweets opp som de er skrevet. Event er en enveis kommunikasjonsmekanisme som gjør det mulig for serveren å sende hendelser til klienten, men ikke omvendt. Hvis du vil lære mer om EventSource, sjekk ut denne opplæringen.
Fordi det er skrevet ved hjelp av disse teknologiene, vil det være mulig for noen å skrive et kryssplattformutvidelsesutviklingsbibliotek som fungerer på tvers av Firefox (Jetpack), Chrome og Safari 5.
Det er nå utvidelsesstøtte i Safari, og takket være et nytt verktøy kalt Extension Builder i den allerede nyttige utviklingsmenyen, kan du skrive din egen. Utvidelsene er skrevet ved hjelp av vanlige webteknologier, inkludert HTML, CSS og JavaScript, og utvidelsesprogrammet fra Apple. Fordi det er skrevet med disse teknologiene, vil det være mulig for noen å skrive et utviklingsbibliotek for kryssplattformutvidelser som fungerer på tvers av Firefox (Jetpack), Chrome og Safari 5. Alle bruker webteknologi til å bygge utvidelser for nettleserne. For sikkerhet må alle utvidelser for Safari 5 bli kryptografisk signert av Apple gjennom Safari Dev Center.
Senere i sommer åpner Apple Safari Extensions Gallery, som gir brukerne et enkelt sted å finne installasjonsutvidelser. Panikk viser allerede sin utvidelse kalt Code Notes, som når det kommer ut, vil tillate deg å legge til kommentarer til nettsider ved å tegne og skrive tekstnotater direkte på nettstedet. Utvidelsen vil da tillate deg å dele kommentarene dine via e-post. Et veldig kult eksempel på hva Safari 5-utvidelser API kan.
Det ville ikke være en fullstendig oppgradering av nettleseren hvis Apple ikke tok sin 30% raskere JavaScript Engine. I SunSpider JavaScript-ytelsestesten ligger Safari tilsvarende på Google Chrome, og er fortsatt langt foran den nyeste versjonen av Firefox. Selv om JavaScript-ytelsen er viktig, ligger de ekte ytelse flaskehalsene for webapplikasjoner ikke i den røde JavaScript-språkytelsen, men i DOM API, som er notorisk sakte i alle nettlesere. Jeg håper mer oppmerksomhet blir betalt til DOM-ytelsen i fremtiden.
Selv om det ikke er spesifikt en webutviklerfunksjon, er jeg sikker på at du leser mange artikler som denne på Internett. Safari Reader er essensielt en måte å få alle de ødeleggelsene ute av veien mens du leser bare artikkelen. På samme måte som leserbarhetens bokmerke, anerkjenner Safari Reader automatisk sider med en artikkel i dem, og presenterer en knapp i verktøylinjen som trekker ut teksten og bildene fra bare artikkeldelen av siden og viser dem i en fin lesbar skrift. Det er også veldig fint at du enkelt kan sende og skrive ut bare artikkelen mens du ser på leservisningen. Jeg er sikker på at jeg vil bruke dette mye!
Selv om det ikke er en stor utgave når det gjelder brukerfunksjoner, er Safari 5 en veldig fin utgave for utviklere. Med mye bedre HTML5-støtte, økt JavaScript-ytelse og en bedre Web Inspector, er Safari nå min utviklingsbrowser av valg. Hva med deg?
Accentsconagua