10 CSS i JavaScript alata za optimizaciju koda
Alati za ispisivanje mogu značajno pomoći razvojnim programerima napisati kvalitetan, optimiziran kod. Linting je proces provjere koda koji traži pogreške u izvornom kodu i označava potencijalne bugove. Većina lintera koristi tehniku statičke analize koda, što znači kôd se provjerava bez stvarnog izvršenja.
Možete pisati u različitim prilikama, kao što je to u realnom vremenu dok pišete kod, kada spremate datoteku, kada urezujete promjene, ili prije nego što kôd uđe u produkciju. Kakav god bio vaš radni proces, važno je to redovito, jer vas može spasiti od mnogih glavobolja u budućnosti.
Linters nisu samo alati za sprječavanje bugova, već se mogu učinkovito koristiti i za ispravljanje pogrešaka pronaći pogreške koje je teško uhvatiti inače. U ovom ćemo postu provjeriti 10 snažnih alata za ispisivanje koje možete koristiti za ispisivanje CSS i JavaScript datoteka kako biste poboljšali kvalitetu koda.
1. CSSLint
CSSLint, doduše, namjerava "povrijediti vaše osjećaje", ali u zamjenu "čini vam puno šifriranjem". CSSLint trenutno vodi tržište CSS lintinga. Napisano je u JavaScriptu, to je open-source, i dolazi s mnogo opcija koje se mogu konfigurirati.
CSSLint vam omogućuje odaberite koju vrstu pogrešaka i upozorenja (kompatibilnost, izvedba, umnožavanje itd.) za koje želite testirati, i potvrđuje vašu CSS sintaksu u odnosu na pravila koja se odlučite.
Ne radi samo u pregledniku, već ima i sučelje naredbenog retka, a možete ga integrirati iu svoj vlastiti sustav za izgradnju.
2. SublimeLinter CSSLint
CSSLint je tako učinkovit CSS linter da je teško pronaći konkurenta koji mjeri do njega. Vjerojatno je to razlog što je SublimeLinter linting framework na vrhu njega izgradio svoj CSS plugin. SublimeLinter je SublimeText dodatak koji korisnicima pruža mogućnost da svoj kôd (CSS, PHP, Python, Java, Ruby itd.) ispune u samom izdanju SublimeTextr.
Prije nego instalirate sam plugin SublimeLinter CSSLint, morate instalirati CSSLint kao Node.js modul. Velika je stvar kod ovog praktičnog alata da ste vi samo jednom konfigurirati postavke, ili ako ste zadovoljni zadanim postavkama, ne morate to učiniti, tada uvijek možete dobiti relevantna upozorenja i obavijesti unutar svog uređivača SublimeText bez ikakvih daljnjih poteškoća.
3. StyleLint
StyleLint pomaže razvojnim inženjerima da izbjegnu pogreške u CSS-u, SCSS-u ili bilo koje druge sintakse koje PostCSS može analizirati. StyleLint testira više od stotinu pravila i možete odaberite koje želite uključiti (pogledajte primjer konfiguracije).
Ako ne želite izgraditi vlastitu konfiguraciju, možete se odlučiti i za unaprijed napisanu, standardnu konfiguraciju koja sadrži oko 60 pravila za StyleLint. StyleLint je prilično fleksibilan alat, može se proširiti dodatnim dodatcima i koristiti u 3 različita oblika: kao alat naredbenog retka, kao Node.js modul ili kao PostCSS dodatak.
4. W3C CSS Validator
Iako WSC-ov CSS Validator obično nije zamišljen kao alat za ispisivanje, programerima daje sjajnu priliku da provjere CSS izvorni kod prema službenim standardima W3C-a. W3C je izgradio svoje validatore s namjerom da osigura alat koji je sličan Lint programu za provjeru jezika C.
Isprva su stvorili HTML validator oznaka koji je kasnije slijedio CSS validator. W3C-ov CSS validator nema toliko opcija kao CSSLint, ali to vraća detaljne, lako razumljive poruke o pogreškama i obavijesti.
Kao dodatnu značajku, također možete provjeriti svoj kod prema W3C-ovim nedavnim mobilnim web standardima, što nije loše u eri mobilnog weba.
5. Dirty Markup
Dirty Markup čisti, formatira i potvrđuje HTML, CSS i JavaScript kod. To može biti odličan izbor ako vam se sviđa jednostavan dizajn i želite brzo rješenje. Dirty Markup baca poruke o pogreškama i obavijesti u realnom vremenu dok ti pisati ili mijenjati svoj kôd unutar urednika.
Kada pogodiš “Čist” gumb popravlja pogreške sintakse odjednom, uređuje format, ali upozorenja ostavlja netaknuta dopuštajući vam da ih riješite kako god želite. Ne možete odabrati za koja pravila želite testirati, ali sva tri tipa datoteka imate nekoliko postavki koje vam omogućuju da odredite format očišćenog izlaza.
6. JSLint
JSLint je prvi put objavljen 2002. godine od strane Douglasa Crockforda, a od tada nije izgubio zamah, pa sigurno možete pretpostaviti da je to stabilan i pouzdan alat za JavaScript..
JSLint može obraditi JavaScript izvorni kod i JSON tekst, a dolazi s a gotova konfiguracija koja slijedi JS najbolje prakse Crockford je pisao u svojoj knjizi pod naslovom JavaScript: Dobri dijelovi.
JSLint ima nekoliko opcija od kojih možete birati, ali vi ne možete dodati vlastita prilagođena pravila ili onemogućiti većinu značajki. JSLint je već počeo uključivati najnovije ECMAScript 6 standarde, možete provjeriti trenutnu fazu implementacije ES6 ovdje.
7. JSHint
JSHint je vrlo popularna vilica JSLinta, a koriste je velike tehnološke tvrtke kao što su Facebook, Twitter i Medium
JSHint je projekt vođen zajednicom koji je započeo s nastojanjem stvorite više konfigurabilnu i manje izraženu verziju JSLinta. JSHint omogućuje razvojnim programerima da konfiguriraju bilo koju od svojih opcija za linting i smjeste prilagođenu konfiguraciju u zasebnu datoteku, opciju koja čini alat lako ponovljivim, i dobro se uklapa u veće projekte.
Ne samo da možete koristiti JSHint za ispisivanje vanilije JavaScripta, već i za izvanrednu podršku za mnoge popularne JS knjižnice, kao što su jQuery, Mootools, Mocha i Node.js.
8. ESLint
ESLint je najnovija velika stvar u JavaScript okruženju. Njegova popularnost proizlazi iz njezine vrlo fleksibilne prirode. Ne samo da možete prilagoditi tone svojih sofisticiranih pravila za ispisivanje, već ih i integrirati u sve glavne uređivače koda, ali možete i jednostavno proširiti svoje funkcionalnosti dodavanjem različitih dodataka.
Određivanjem opcija parser-a također možete odaberite koji standard JS jezika želite podržati tijekom procesa lintinga, što znači da ne samo da možete provjeriti svoje skripte protiv zadane ECMAScript 5 sintakse, nego i protiv ECMAScript 6, ECMAScript 7 i JSX.
9. JSCS
JSCS ili JavaScript Code Style je prikladan linter za stil koda koji provjerava pravila oblikovanja koda.
Cilj JSCS-a je osigurati sredstva programski provesti pridržavanje određenog vodiča za stil kodiranja. Iako JSCS ne provjerava greške i greške, i dalje ih koriste mnogi veliki igrači u tehnološkoj industriji, kao što su Google, AirBnB i AngularJS, jer pomaže razvojnim inženjerima u održavanju vrlo čitljive i konzistentne baze koda.
JSCS štedi vrijeme u stvarnom vremenu, jer automatski popravlja vaše pogreške oblikovanja, tako da ne morate prolaziti kroz njih jedan po jedan. Ima mnogo različitih preseta koji pripadaju većim projektima, kao što su Google, Grunt, ili stilovi kodiranja stilova Wikimedije, koje možete lako koristiti u vlastitim projektima, ali možete stvoriti i vlastitu prilagođenu konfiguraciju.
10. StandardJS
StandardJS, ili JavaScript Standard Style je linter za stilski kod poput JSCS, ali se razlikuje od toga u svojoj jednostavnosti i jednostavnosti. StandardJS može biti izvrstan izbor, ako ne želite provoditi vrijeme s konfiguracijom, samo želim učinkovit alat koji ponestaje iz kutije.
StandardJS slijedi pregršt pravila pisanja, a njezina temeljna vrijednost je da vaš tijek kodiranja ne odvlači pažnju, tako da ne možete mijenjati pravila s kojima se ne slažete. Samo odaberite StandardJS ako ne želite imati prilagođenu konfiguraciju i samo to želite nametnuti konzistentan stil koda preko JavaScript datoteka.
