Parimad JavaScripti teegid

Õiged JavaScripti teegid võivad veebiarendusest palju stressi võtta. Paljud igapäevased kodeerimisülesanded, mille peate arendajana võtma, on juba lahendatud ja raamatukogudena kättesaadavaks tehtud, miks siis ratast uuesti leiutada?

Oleme jahtinud 15 kõige olulisemat JavaScripti teeki, mis aitavad teil lahendada tavapäraseid kodeerimisprobleeme ja säästavad ütlematut aega ja vaeva. Need aitavad

kuidas perspektiivvõrgustiku Adobe illustraatorist lahti saada

Siin olles võiksite vaadata ka meie juhendit parimad JavaScripti raamistikud ja JavaScripti API-d .



Lugege oma kollektsiooni laiendamiseks veebidisaini tööriistad , muutke oma elu lihtsamaks ja muutuge samal ajal produktiivsemaks.

01. Math.js

Parimad JavaScripti teegid: Math.js

Hoogustage JavaScripti matemaatikaoskusi(Pildikrediit: Jos de Jong)

Kuigi JavaScripti keelestandard sisaldab küllaltki palju matemaatilisi funktsioone, pole see - muidugi - sugugi täielik.

Üks tavaliselt kasutamata jäetud funktsioon hõlmab keerulisi numbreid. Math.JS pakub suhteliselt hõlpsasti kasutatavat API-d, mille põhikasutus näeb välja selline:

const a = math.complex(2, 3) print(a.re) 2 print(a.im) 3

Ujuvarvude täpsus on JavaScripti käituste teine ​​teema. Math.JS lahendab selle probleemi, pakkudes fikseeritud punkti ujuva arvu rakendamist - määrake lihtsalt soovitud täpsus ja tõstke kümnendarv:

math.bignumber('2.3e+500') BigNumber, 2.3e+500

Pidage meeles, et BigNumber ja selle erinevad klassid ei ole kõigi digitaalsete probleemide jaoks imerohi. Fikseeritud punkti aritmeetika on teadaolevalt palju aeglasem kui riistvaraliselt kiirendatud ujukmatemaatika - kui teil pole head põhjust suurema täpsuse kasutamiseks, tehke parem ilma selleta.

02. Infoleht

Parimad JavaScripti teegid: voldik

Tehke kiiresti interaktiivseid kaarte(Pildikrediit: Vladimir Agafonkin)

Kui teil õnnestub plaatide allikale kätte saada, saate kiiresti teada, et kaardiplaatide omamine on vaid poole kuu üür. Infoleht pakub suhteliselt põhjalikku plaatide renderdamise infrastruktuuri, mis hoolitseb nende paindliku ekraanile toomise eest.

03. Anime.js

Parimad JavaScripti teegid: Anime.js

Kerge JavaScripti animatsioonikogu(Pildikrediit: Julian Garnier)

Anime.JS pakub võtmekaadri animatsiooni mugavalt kasutatavat rakendust. Määrake algus-, lõpp- ja lihtsustusfunktsioon - teek ja brauser kasutavad CSS-i teisendusi tagamaks, et teie animatsioone käitatakse optimaalse kiirusega.

04. Kiirklahvid

Parimad JavaScripti teegid:

Lihtne viis klaviatuuri sisestuse jäädvustamiseks(Pildikrediit: Kenny Wong)

Klaviatuuripõhise liidese pakkumine meelitab tooteid kasutajatele. Kiirklahvid hoolitseb klaviatuurihalduse sageli keeruliste üksikasjade eest, jättes teile keskenduda äriloogika realiseerimisele. Alustamiseks on vaja vähem kui kümmet koodirida!

05. Lihtne sisse- ja väljalülitamise olek

Parimad JavaScripti teegid:

Lülitab mis tahes HTML-elemendi oleku(Pildikrediit: Matthieu Bué)

GUI elementide programmiline lubamine ja keelamine on vana, kuid korduv ülesanne. Lihtne sisse- ja väljalülitamise olek pakub lõputu ülesande täitmiseks korraliku viisi - rühmitage elemendid kokku ja lülitage need sisse ja välja ilma higi purustamata.

06. Autonumbriline

Parimad JavaScripti teegid:

Veenduge, et numbrid ja valuutad oleksid kogu maailmas head(Pildikrediit: Alexandre Bonneau)

Numbrite hea välja nägemine lokaalides on keeruline. Automaatne numbriline on raamatukogu, mis on pühendatud maailma numbrivormingutele ja valuutadele. Lihtsalt sisestage numbriline muutuja ja pidutsege oma silmi stringiga. Raamatukogu saab tekstivälju ka 'jälgida', et need paremad välja näeksid.

07. D3.js

Parimad JavaScripti teegid:

Suurepärane raamatukogu skeemide ja visualiseeringute ehitamiseks(Pildikrediit: D3)

D3 loob sidemed suvaliste DOM-objektide ja taga olevasse koodi salvestatud elementide vahel. See tähendab, et veebisaidi välimust saab salvestatud andmete põhjal paindlikult kohandada.

D3 erineb traditsioonilistest skeemide teekidest selle poolest, et see ei paku mingeid malle. Näiteks kui soovite luua sektordiagrammi, alustage parem ristkülikute toomisest ja andmete sidumiste lisamisest kõrguse jt arvutamiseks.

Raamatukogu särab alati, kui on vaja ülimalt keerukaid ja / või animeeritud visualiseeringuid ning seadistamise aeg pole probleem. Üks populaarne näide oleks choropleth-kaardid, mida tavaliselt kasutatakse valimistest aruandluses. See on muidugi imepisike ülevaade - leiate täiendavaid õpetusi siin .

08. Element

Parimad JavaScripti teegid:

Element sisaldab virna valmis GUI vidinaid(Pildikrediit: Element)

JavaScripti graafilise kasutajaliidese korstnad on kümme senti. Element erineb ülejäänud valdkonnast selle poolest, et seda sponsoreerivad erinevad suured Hiinas ja USA-s asuvad veebifirmad.

Tehnilisest vaatenurgast on Element üldiselt Vue 2.0-l põhinev GUI-vidinate hästi toetatud kogu. Importige see oma veebiprojekti, lisage konkreetsed vahelehed ja 'häkkige ära' nagu oleks see olnud jQuery kasutajaliides.

Üks piirkond, kus toode tõeliselt särab, hõlmab kuupäeva ja kellaaja valijate kuvamist. Järgmine koodilõik loob juhtelementide komplekti, mis võimaldab kasutajal määrata mitu kuud:

Kahjuks nõuab Elementiga alustamine natuke käsitööd. Kõige mugavam viis hõlmab stardikomplekt ja selle käivitamine Node.JS-i keskkonnas.

09. HighCharts

Parimad JavaScripti teegid:

Edetabelite ülaosa(Pildikrediit: Highcharts)

Kui avatud lähtekoodiga JavaScripti skeemide teegid on tavaliselt saadaval, nõuavad mõned töökohad täiendavat „klienditoe turvalisust”, mida pakub kommertstarkvara. Sel juhul, HighCharts on kindel panus.

Juba läbi aegade turul olnud toodet on pikka aega mitmekesistatud, et hõlmata Androidi visualiseerimislahendusi, kaardistamist ja börsiturgu.

HighChartsi diagrammi käivitamine on lihtne. Käivitage funktsioon chart () koos a silt ja objekt, mis sisaldab täiendavaid kirjeldusi:

Highcharts.chart('container', { chart: { scrollablePlotArea: { minWidth: 700 } },

Highcharts erineb konkurentidest sellega, et suudab hankida oma andmeid erinevatest allikatest. Üks näide on järgmine, mis kasutab kolmanda osapoole serveris hostitud CSV-faili:

mis järgmistest ei ole point-and-shoot kaamera omadus?
data: { csvURL: 'https://cdn.jsdelivr.net/gh/ highcharts/highcharts@v7.0.0/samples/data/ analytics.csv', . . . },

10. Allakriips.js

Parimad JavaScripti teegid:

Alljoon pakub hulgaliselt valmis ja kergeid funktsioone(Pildikrediit: DocumentCloud)

Kuigi sellised teegid nagu jQuery on populaarsed, lisavad nad teie tootesse märkimisväärses koguses koodi. Alajoon.js pakub väikest ja hästi kureeritud valikut API-sid, mis muudab selle ideaalseks valikuks veebiprojektide jaoks, kus ruum on lisatasu eest.

11. Hammer.js

Parimad JavaScripti teegid:

Sa tead, mis kell on(Pildikrediit: kaheksa meediat)

Puudutusžestide äratundmine võib olla tüütu protsess. Hammer.js lihtsustab seda tööd - määrake puudutatavad alad ja oodake, kuni sündmused kuulaja funktsioonidesse langevad.

12. Finance.js

Parimad JavaScripti teegid:

Selle raamatukoguga saate hakkama keeruliste finantsarvutustega(Pildikrediit: Essam Al Joubori)

Amortisatsiooni ja sarnaste finantsmatemaatiliste protsesside programmeerimine pole keeruline, kuid tüütu. Rahandus.JS lisab teie brauserisse matemaatikaobjekti - see tagab mugava juurdepääsu erinevatele sageli kasutatavatele finantsarvutustele.

13. Needid

Parimad JavaScripti teegid:

Needid on suurepärane andmete sidumise lahendus(Pildikrediit: Michael Richards)

Juhtelementide ühendamine mudelites salvestatud andmetega nõuab tavaliselt mingisuguse raamistiku kasutamist. Needid töötab selle probleemi ümber - kui te ei soovi keerukat koodi käivitada, andke tootele kindlasti võimalus.

14. Raadio

Parimad JavaScripti teegid:

Raadio on populaarne raamatukogu lihtsate sündmustepõhiste süsteemide loomiseks(Pildikrediit: GitHub / Ted Faison)

Ted Faisoni töö tutvustas arendajatele sündmustepõhist programmeerimist. Kui leiate end lihtsa ürituste süsteemi otsimisest, kasutage seda julgelt Raadio . Kuigi selle tegija on pankrotti läinud, on populaarne raamatukogu tugev.

15. Bideo.js

Parimad JavaScripti teegid:

Lihtne viis täisekraaniga videotausta lisamiseks(Pildikrediit: Rishabh)

Puristid võivad täisekraani videot näha kõige dekadentsema ja kasutumata taustana. Mõnel kujundusel on sellest siiski palju kasu - sel juhul kasutage Bideo.js et videotöötlusest tulenev stress maha võtta.

See artikkel ilmus algselt loomingulise veebidisaini ajakirja 289. numbris Veebi disainer . Osta väljaanne 289 siit või tellige veebidisainer siit .

Seotud artiklid: