Uued ressursid veebidisaineritele ja arendajatele (oktoober 2017)

Sel kuul on värsked resoucesid eelmiste kuude jooksul veidi erinevad. Meie, veebiarendajad, elame kiiresti muutuvas tööstuses ja ma olen näinud palju teateid mõnest suurimast tehnoloogiaettevõttest, nagu Google, Microsoft, Firefox ja PHP, mis muudavad meie ehitamise viisi võrk.

Selles osas on pool meie nimekirjast nende teadaannete kohta. Niisiis, olge valmis tulevikus tere!

Oluline pildi optimeerimine

See on ammendav artikkel veebi kujutise optimeerimiseks kirjutas Addy Osmani. See ei ole nagu teised kirjutised, mis pöörlevad ümber ainult vihjeid või tegusid ja mitte.

See artikkel räägib teid tehnilistest üksikasjadest ja ka optimeerimise taga. Samuti leiate põhjalikku teavet mitme optimeerimisviisi ja pildivormingute kohta, tööriistad, näpunäited ja mõned reaalsed näited.

PHP 7.2

Põhjalik viide sellele, mis saabub PHP-le 7.2. Lisaks PHP rakenduse jõudlust parandavatele täiendustele kaasneb ka PHP 7.2 amortisatsioon, milles mitmed asjad eemaldatakse ja seda ei tohiks enam kasutada.

PHP 7.2-s on kaks funktsiooni, mis tuleb tühistada create_function () ja __autoload (). Kui olete veebi arendaja, vaadake oma kood läbi ja tehke vajalikud muudatused. Olen näinud mitmeid WordPress pluginaid, mis kasutavad neid kahte funktsiooni.

Veebi jagamise API

Ausalt ei näinud see API seda veebi. Kuna aga pool meie suhtlusest veebis on “jagamine”, see API muudab asjad suuresti veebiarendajatele on lihtsam luua natiivne jagamiskogemus, eriti mobiilplatvormil.

See API on praegu saadaval ainult Google Chrome'is töölaual ja Androidis. Vaadake seda Youtube'i videot, et seda näha.

Image Async atribuut

Teine asi, mis veebi revolutsiooniliselt muudab, on async atribuut img elemendile. Kirjutamise ajal on olemas käputäis lähenemisviise laadige asünkroonselt pilt, mis sisaldab natuke JavaScriptit. Peagi saame lihtsalt lisada async = sisse peale img element.

Firefox Quantum

Mozilla on Firefoxi värskendusi agressiivselt mõnede parandustega, koodiga “Projekt Quantum”. See sisaldab Quantum CSS - uut mootorit äärmiselt kiire CSS-i renderdamine, uus kasutajaliides ja uued DevTools.

Vabastus on veebiarendajate veojõu hankimine ja mõned on juba vahetanud oma peamise brauseri Firefoxi. Selles projektis on veel palju, sealhulgas Quantum DOM ja WebRender. Kas me näeme Node.js-i kandidaati Firefox Quantum'i mootoril? Noh, võib-olla jah.

MS Edge iOS ja Android jaoks

Microsoft on just teatanud vabastage oma uusim brauser, Edge, iOS ja Android. See tähendab, et teie veebisaitidel on veel üks brauser.

Gutenberg

WordPress on praegu ambitsioonikas projekt, kood nimega Gutenberg. Gutenberg on a Facelift WordPressi toimetajale, mis on ehitatud peaaegu täielikult JavaScripti abil.

Sel hetkel on Gutenberg ehitatud Reactiga kuid projekt kaalub teist raamistikku nagu Preact, Vue või midagi muud. Praegu on see keeruline olukord. Niisiis, WordPressi arendajatele hoiavad teemasid ja pluginaid oma silma peal see muudab viisi, kuidas me WordPressi igaveseks ehitame.

FoitFout

FoitFout on mugav vahend kahe erineva lähenemisviisi võrdlemiseks nn FOIT ja FOUT laadige veebis kohandatud fonte. Selle tööriistaga on teil võimalik mõlemat lähenemist jäljendada ja otsustada, milline lähenemine teie saidile kõige paremini sobib.

Vuera

Vuera on a JavaScripti raamatukogu, mis võimaldab teil kasutada Vue ja React koos. Võite lisada Vue komponendi a-st .vue või kasutage reaktiivkomponenti Vue'is. Sinu meeskond saab nüüd olla mis tahes raamistikuga tootlikumaks mida nad eelistavad kasutada.

Lohistatav

“Lohistatav” on fantastiline raamatukogu Shopifyst. See on ehitatud kohaliku brauseri peale Drag-n-Drop API ja võimaldab teil ulatuslikku API-d töötada. Juhul, kui see ei anna midagi, mida vajate, saate kirjutada a kohandatud moodul oma funktsioonide laiendamiseks. Tutvu demoga, et näha, kuidas see toimib.

VooskeemJS

Nagu nimigi ütleb, on FlowchartJS a raamatukogu, mis võimaldab luua vooskeemi nagu PowerPointis. Samuti saate luua erinevaid diagramme, sealhulgas ringi, ellipsi, ruudu, teemandi, kolmnurga jne.

QuickBill

Kerge ja kerge arve koostamiseks lihtne veebirakendus. Ta kasutab natiivseid brauseritehnoloogiaid ja API-sid, nii et kontot pole vaja. Lihtsalt minge veebisaidile, lisage need arvele ja genereerige PDF-fail. See ongi see!

Mocka

Mocka on a sisu kohatäitja, mida saate kasutada prototüübi veebisaidi jaoks. See on ainult 500 baiti ja täielikult kohandatav. Sass mixini abil saate selle hõlpsasti lisada oma projekti CSS-faili.

The CSS pakub mitmeid klasse kaasa arvatud mocka-meedia kujutise kohahoidja loomiseks, mocka-pealkiri pealkirja loomiseks ja mocka-tekst meelevaldse teksti loomiseks.

VueStar

VueStar on a Vue komponent, mis lisab ikoonile klikkides vahuveini, sarnane Twitteriga “süda” ikoon oma mobiilirakenduses. Komponent tutvustab uut elementi vue-star kus saate selle veebiajastusse lisada. Ja sa oled valmis!

Grid mänguväljak

CSS Grid tutvustab veebis uut kontseptsiooni, et luua paigutus ja see on esmapilgul keeruline, arvestades mitmeid uusi omadusi, mis tal on.

GridPlayground on põhimõtteliselt a Mozilla algatus CSS Grid'i õpetamiseks ja CSS Grid'i kasutuselevõtu edendamiseks. Isegi Firefox toob DevToolsile uue tööriista, et kontrollida Grid-paigutust.

Väljavõtete haldur

“Väljavõtete haldur” on lihtne rakenduse koodilõikude salvestamiseks ja haldamiseks. Saate luua uue elemendi, kleepida koodi ja määrata punkti. Siinkohal pole midagi liiga väljamõeldud ja see annab ainult lähtekoodi, mida peate NPM-i abil kompileerima.

Vahekaart

Suur progressiivne ja ligipääsetav vahekaartide navigeerimine, kasutades minimaalset JavaScripti. Suurepärane ressurss neile, kes soovivad tutvuda ligipääsetava disainiga.

SwissInCSS

SwissInCSS eksponeerib mitmeid klassikalisi Šveitsi plakatite kujundeid, kasutades mitte ühtegi muud kui CSS. Lähtekood on saadaval CodePenis.