Persistent Storage API: Verkkosovellusten tallennuskiintiön ymmärtäminen ja hallinta

Persistent Storage API tarjoaa verkkokehittäjille standardoidun tavan pyytää ja hallita tallennuskiintiötä käyttäjän selaimessa. Toisin kuin perinteiset tallennusmekanismit, kuten evästeet tai localStorage, jotka ovat usein kooltaan rajoitettuja ja alttiita automaattiselle poistamiselle, Persistent Storage API antaa sovellusten pyytää suurempia tallennusmääriä ja, mikä tärkeintä, pyytää tallennustilan pysyvyyttä – tämä tarkoittaa, että selain ei automaattisesti tyhjennä sitä, edes tallennustilan paineen alla.

Miksi pysyvä tallennustila on tärkeää

Nykypäivän verkossa, jossa progressiiviset verkkosovellukset (PWA) ovat yhä yleisempiä ja käyttäjät odottavat monipuolisia offline-kokemuksia, luotettava tallennustila on välttämätöntä. Harkitse näitä skenaarioita:

• Asiakirjojen offline-käyttö: Asiakirjojen muokkaussovellus (kuten Google Docs) tarvitsee tallentaa asiakirjoja paikallisesti, jotta käyttäjät voivat jatkaa työskentelyä myös ilman internetyhteyttä.
• Median toisto: Suoratoistopalvelut, kuten Spotify tai Netflix, antavat käyttäjien ladata sisältöä offline-toistoa varten, mikä vaatii merkittävää tallennustilaa.
• Pelidata: Verkkopelit tallentavat usein käyttäjän edistymisen, tasot ja resurssit paikallisesti tarjotakseen sujuvan ja reagoivan kokemuksen.
• Suurten tietojoukkojen välimuistiin tallentaminen: Suuria tietojoukkoja käsittelevät sovellukset, kuten karttasovellukset (esim. Google Maps, OpenStreetMap-pohjaiset sovellukset), hyötyvät datan paikallisesta välimuistiin tallentamisesta verkkopyyntöjen vähentämiseksi ja suorituskyvyn parantamiseksi.
• Paikallinen tietojenkäsittely: Verkkosovellukset, jotka suorittavat raskasta tietojenkäsittelyä (esim. kuvankäsittely, videonmuokkaus), voivat tallentaa välituloksia paikallisesti välttääkseen toistuvia laskutoimituksia.

Ilman pysyvää tallennustilaa selain saattaa automaattisesti tyhjentää näiden sovellusten käyttämän tallennustilan, kun laitteen tila on vähissä, mikä johtaa turhauttavaan käyttäjäkokemukseen ja mahdolliseen tietojen menetykseen. Persistent Storage API ratkaisee tämän ongelman tarjoamalla mekanismin, jolla sovellukset voivat pyytää pysyvää tallennustilaa ja seurata tallennustilan käyttöä.

Tallennuskiintiön ymmärtäminen

Jokainen selain varaa tietyn määrän tallennustilaa kullekin alkuperälle (domain). Tämä tallennuskiintiö ei ole kiinteä ja voi vaihdella riippuen tekijöistä, kuten laitteen kokonaistallennuskapasiteetista, vapaan tilan määrästä ja käyttäjän selainasetuksista. Storage API tarjoaa metodeja käytettävissä olevan tallennuskiintiön ja jo käytetyn tallennustilan määrän kyselyyn.

Tallennuskiintiön kysely

navigator.storage-rajapinta tarjoaa pääsyn tallennustilaan liittyviin tietoihin. Voit käyttää estimate()-metodia saadaksesi arvion käytettävissä olevasta tallennuskiintiöstä ja sovelluksesi käyttämästä tallennustilan määrästä. Palautettu objekti sisältää usage- ja quota-ominaisuudet, jotka molemmat mitataan tavuina.

            
async function getStorageEstimate() {
  if (navigator.storage && navigator.storage.estimate) {
    const estimate = await navigator.storage.estimate();
    console.log(`Käyttö: ${estimate.usage}`);
    console.log(`Kiintiö: ${estimate.quota}`);
    console.log(`Käyttöprosentti: ${(estimate.usage / estimate.quota * 100).toFixed(2)}%`);
  } else {
    console.warn("Tallennustilan arviointi-API:ta ei tueta.");
  }
}

getStorageEstimate();

            

              
                Copy
              
            
          

Esimerkki: Oletetaan, että estimate.usage palauttaa 10485760 (10 Mt) ja estimate.quota palauttaa 1073741824 (1 Gt). Tämä osoittaa, että sovelluksesi on käyttänyt 10 Mt sen 1 Gt:n kiintiöstä, mikä on noin 1 % käytettävissä olevasta tallennustilasta.

Kiintiöarvojen tulkinta

quota-arvo edustaa suurinta tallennustilan määrää, jonka sovelluksesi *voi* käyttää. On kuitenkin tärkeää ymmärtää, että tätä kiintiötä ei taata. Selain voi pienentää kiintiötä, jos laitteen tallennustila on vähissä tai jos käyttäjä tyhjentää selaimen tiedot. Siksi sovelluksesi tulisi suunnitella käsittelemään tilanteita, joissa käytettävissä oleva tallennustila on pienempi kuin ilmoitettu kiintiö.

Paras käytäntö: Toteuta mekanismi tallennustilan käytön seurantaan ja ilmoita käyttäjälle ennakoivasti, jos sovellus lähestyy tallennusrajaansa. Tarjoa käyttäjälle vaihtoehtoja tarpeettomien tietojen poistamiseen tai tallennussuunnitelman päivittämiseen (jos sovellettavissa).

Pysyvän tallennustilan pyytäminen

Vaikka sovelluksellasi olisi riittävästi tallennuskiintiötä, selain saattaa silti automaattisesti tyhjentää sovelluksesi tiedot tallennustilan paineen alla. Estääksesi tämän voit pyytää pysyvää tallennustilaa käyttämällä navigator.storage.persist()-metodia.

            
async function requestPersistentStorage() {
  if (navigator.storage && navigator.storage.persist) {
    const isPersistent = await navigator.storage.persist();
    console.log(`Pysyvä tallennustila myönnetty: ${isPersistent}`);

    if (isPersistent) {
      console.log("Tallennustilaa ei tyhjennetä automaattisesti.");
    } else {
      console.warn("Pysyvää tallennustilaa ei myönnetty.");
      // Anna käyttäjälle ohjeita, kuinka pysyvä tallennustila otetaan käyttöön selaimessa.
    }
  } else {
    console.warn("Pysyvän tallennustilan API:ta ei tueta.");
  }
}

requestPersistentStorage();

            

              
                Copy
              
            
          

persist()-metodi palauttaa boolean-arvon, joka ilmaisee, myönnettiinkö pysyvän tallennustilan pyyntö. Selain saattaa pyytää käyttäjältä lupaa ennen pysyvän tallennustilan myöntämistä. Tarkka kehote vaihtelee selaimen ja käyttäjän asetusten mukaan.

Käyttäjän vuorovaikutus ja lupa

Selaimen päätös myöntää pysyvä tallennustila riippuu useista tekijöistä, kuten:

• Käyttäjän sitoutuminen: Selaimet myöntävät todennäköisemmin pysyvän tallennustilan sovelluksille, joita käyttäjä käyttää usein.
• Käyttäjän asetukset: Käyttäjät voivat määrittää selainasetuksiaan hallitakseen, miten pysyvän tallennustilan pyyntöjä käsitellään. He voivat valita myöntävänsä kaikki pyynnöt automaattisesti, hylkäävänsä kaikki pyynnöt tai haluavansa kehotteen jokaista pyyntöä varten.
• Käytettävissä oleva tallennustila: Jos laitteen tallennustila on kriittisen vähissä, selain voi hylätä pysyvän tallennustilan pyynnön riippumatta käyttäjän sitoutumisesta tai asetuksista.
• Alkuperän luotettavuus: Turvalliset kontekstit (HTTPS) vaaditaan yleensä pysyvälle tallennustilalle.

Tärkeää: Älä oleta, että pysyvän tallennustilan pyyntö hyväksytään aina. Sovelluksesi tulisi olla joustava tilanteissa, joissa tallennustila ei ole pysyvää. Toteuta strategioita datan varmuuskopioimiseksi palvelimelle tai datan menetyksen hallituksi käsittelemiseksi.

Olemassa olevan pysyvyyden tarkistaminen

Voit käyttää navigator.storage.persisted()-metodia tarkistaaksesi, onko sovelluksellasi jo myönnetty pysyvä tallennustila.

            
async function checkPersistentStorage() {
  if (navigator.storage && navigator.storage.persisted) {
    const isPersistent = await navigator.storage.persisted();
    console.log(`Pysyvä tallennustila on jo myönnetty: ${isPersistent}`);
  } else {
    console.warn("Pysyvän tallennustilan API:ta ei tueta.");
  }
}

checkPersistentStorage();

            

              
                Copy
              
            
          

Tallennusteknologiat ja kiintiö

Persistent Storage API on vuorovaikutuksessa erilaisten selaimessa saatavilla olevien tallennusteknologioiden kanssa. On ratkaisevan tärkeää ymmärtää, miten kiintiö vaikuttaa näihin teknologioihin.

• IndexedDB: Tehokas NoSQL-tietokanta jäsennellyn datan tallentamiseen asiakaspuolella. IndexedDB on tallennuskiintiön rajoitusten alainen ja voi hyötyä merkittävästi pysyvästä tallennustilasta.
• Cache API: Service workerien käyttämä verkkopyyntöjen välimuistiin tallentamiseen, mikä mahdollistaa offline-käytön ja parantaa suorituskykyä. Cache API:n kautta luodut välimuistit lasketaan myös mukaan kokonaistallennuskiintiöön.
• localStorage & sessionStorage: Yksinkertaiset avain-arvo-tallennusratkaisut pienemmille datamäärille. Vaikka localStorage on oletusarvoisesti pysyvä (ellei käyttäjä tyhjennä selaimen tietoja), sen koko on rajoitettu, eikä se hyödy Persistent Storage API:n tarjoamista pysyvyystakuista yhtä paljon kuin IndexedDB tai Cache API. Niiden käyttö lasketaan kuitenkin mukaan kokonaiskiintiöön.
• Evästeet: Vaikka teknisesti tallennusmekanismi, evästeitä käytetään tyypillisesti istunnonhallintaan ja seurantaan suurten datamäärien tallentamisen sijaan. Evästeillä on omat kokorajoituksensa, ja ne ovat erillisiä Storage API:n hallinnoimasta tallennuskiintiöstä.

Esimerkki: PWA-sovellus käyttää IndexedDB:tä käyttäjäprofiilien ja offline-datan tallentamiseen ja Cache API:ta staattisten resurssien, kuten kuvien ja JavaScript-tiedostojen, välimuistiin tallentamiseen. Pysyvän tallennustilan pyytäminen varmistaa, että tämä välimuistissa oleva data poistetaan epätodennäköisemmin, mikä tarjoaa johdonmukaisen offline-kokemuksen.

Parhaat käytännöt tallennuskiintiön hallintaan

Tehokas tallennuskiintiön hallinta on välttämätöntä vankkojen ja käyttäjäystävällisten verkkosovellusten rakentamisessa. Tässä on joitakin parhaita käytäntöjä:

1. Seuraa tallennustilan käyttöä säännöllisesti

Toteuta mekanismi, joka seuraa säännöllisesti sovelluksesi tallennustilan käyttöä navigator.storage.estimate()-metodin avulla. Tämä antaa sinun tunnistaa mahdolliset tallennusongelmat ennakoivasti ja ryhtyä korjaaviin toimenpiteisiin ennen kuin ne vaikuttavat käyttäjäkokemukseen.

2. Toteuta tallennustilan hallinnan käyttöliittymä

Tarjoa käyttäjille selkeä ja intuitiivinen käyttöliittymä heidän tallennustilansa hallintaan. Tämän käyttöliittymän tulisi antaa käyttäjien:

• Nähdä nykyisen tallennustilan käytön.
• Tunnistaa eniten tallennustilaa kuluttavan datan.
• Poistaa tarpeettomia tietoja (esim. välimuistissa olevat tiedostot, ladattu sisältö).

Esimerkki: Kuvankäsittelysovellus voisi tarjota käyttöliittymän, joka näyttää käyttäjille erittelyn yksittäisten kuvien ja albumien käyttämästä tallennustilasta, jolloin he voivat helposti poistaa kuvia, joita he eivät enää tarvitse.

3. Optimoi datan tallennus

Optimoi sovelluksesi datan tallennus minimoidaksesi sen tallennusjalanjäljen. Tämä sisältää:

• Datan pakkaamisen ennen sen tallentamista.
• Tehokkaiden dataformaattien käyttämisen (esim. Protocol Buffers, MessagePack).
• Tarpeettoman datan tallentamisen välttämisen.
• Datan vanhenemiskäytäntöjen toteuttamisen vanhan tai käyttämättömän datan automaattiseksi poistamiseksi.

4. Toteuta hallitun heikentymisen strategia

Suunnittele sovelluksesi käsittelemään hallitusti tilanteita, joissa tallennustila on rajallinen tai pysyvää tallennustilaa ei myönnetä. Tämä voi sisältää:

• Tiettyjen merkittävää tallennustilaa vaativien ominaisuuksien poistamisen käytöstä.
• Varoitusviestin näyttämisen käyttäjälle.
• Mahdollisuuden tarjoamisen datan varmuuskopioimiseksi palvelimelle.

5. Kouluta käyttäjiä pysyvästä tallennustilasta

Jos sovelluksesi nojaa vahvasti pysyvään tallennustilaan, kouluta käyttäjiä pysyvän tallennustilan luvan myöntämisen hyödyistä. Selitä, kuinka pysyvä tallennustila parantaa sovelluksen suorituskykyä ja varmistaa, että heidän tietojaan ei tyhjennetä automaattisesti.

6. Käsittele tallennusvirheet hallitusti

Valmistaudu käsittelemään tallennusvirheitä, kuten QuotaExceededError, joka voi ilmetä, kun sovelluksesi ylittää tallennuskiintiönsä. Tarjoa informatiivisia virheilmoituksia käyttäjälle ja ehdota mahdollisia ratkaisuja (esim. tallennustilan tyhjentäminen, tallennussuunnitelman päivittäminen).

7. Harkitse Service Workerien käyttöä

Service workerit voivat merkittävästi parantaa verkkosovelluksesi offline-ominaisuuksia tallentamalla välimuistiin staattisia resursseja ja API-vastauksia. Kun käytät service workereita, ole tietoinen tallennuskiintiöstä ja toteuta strategioita välimuistin tehokkaaseen hallintaan.

Kansainvälistämiseen liittyvät näkökohdat

Kun suunnittelet sovelluksesi tallennustilan hallinnan käyttöliittymää, ota huomioon seuraavat kansainvälistämisen (i18n) näkökohdat:

• Numeroformaatit: Käytä eri lokaaleille sopivia numeroformaatteja näyttäessäsi tallennustilan käyttöarvoja. Esimerkiksi joissakin lokaaleissa pilkkuja käytetään desimaalierottimina, kun taas toisissa käytetään pisteitä. Käytä JavaScriptin toLocaleString()-metodia numeroiden muotoiluun käyttäjän lokaalin mukaan.
• Päivämäärän ja ajan muotoilu: Jos sovelluksesi tallentaa päivämääriä ja aikoja, muotoile ne käyttäjän lokaalin mukaan näyttäessäsi niitä tallennustilan hallinnan käyttöliittymässä. Käytä JavaScriptin toLocaleDateString()- ja toLocaleTimeString()-metodeja lokaalitietoiseen päivämäärän ja ajan muotoiluun.
• Yksiköiden lokalisointi: Harkitse tallennusyksiköiden (esim. kt, Mt, Gt) lokalisointia vastaamaan eri alueilla käytettyjä käytäntöjä. Vaikka standardiyksiköt ovat laajalti ymmärrettyjä, lokalisoitujen vaihtoehtojen tarjoaminen voi parantaa käyttäjäkokemusta.
• Tekstin suunta: Varmista, että tallennustilan hallinnan käyttöliittymä tukee sekä vasemmalta oikealle (LTR) että oikealta vasemmalle (RTL) -tekstisuuntia. Käytä CSS-ominaisuuksia, kuten direction ja unicode-bidi, tekstin suunnan oikeaan käsittelyyn.

Turvallisuusnäkökohdat

Kun käsitellään pysyvää tallennustilaa, turvallisuus on ensisijaisen tärkeää. Noudata näitä turvallisuuden parhaita käytäntöjä:

• Käytä HTTPS:ää: Tarjoile sovelluksesi aina HTTPS:n kautta suojataksesi dataa siirron aikana ja estääksesi väliintulohyökkäykset. HTTPS on myös vaatimus pysyvälle tallennustilalle monissa selaimissa.
• Puhdista käyttäjän syötteet: Puhdista kaikki käyttäjän syötteet ennen niiden tallentamista estääksesi sivustojen väliset komentosarjavirheet (XSS).
• Salaa arkaluontoinen data: Salaa arkaluontoinen data ennen sen paikallista tallentamista suojataksesi sitä luvattomalta käytöltä. Harkitse Web Crypto API:n käyttöä salaukseen.
• Toteuta turvalliset datankäsittelykäytännöt: Noudata turvallisia koodauskäytäntöjä estääksesi tietovuodot ja varmistaaksesi tallennetun datasi eheyden.
• Tarkista ja päivitä koodiasi säännöllisesti: Pysy ajan tasalla uusimmista turvallisuusuhista ja haavoittuvuuksista ja tarkista ja päivitä koodiasi säännöllisesti niiden korjaamiseksi.

Esimerkkejä eri alueilta

Tarkastellaan, miten tallennuskiintiön hallinta voi erota eri alueilla:

• Alueet, joilla on rajoitettu kaistanleveys: Alueilla, joilla on rajoitettu tai kallis internetyhteys, käyttäjät voivat olla enemmän riippuvaisia offline-käytöstä ja välimuistista. Siksi sovellusten tulisi priorisoida tehokasta tallennustilan käyttöä ja antaa selkeitä ohjeita välimuistissa olevan datan hallintaan. Esimerkiksi joissakin osissa Afrikkaa tai Kaakkois-Aasiaa datan hinta on merkittävä huolenaihe.
• Alueet, joilla on tiukat tietosuojasäännökset: Alueilla, joilla on tiukat tietosuojasäännökset, kuten Euroopan unionissa (GDPR), sovellusten on oltava avoimia siitä, miten ne käyttävät tallennustilaa, ja hankittava nimenomainen suostumus käyttäjiltä ennen henkilötietojen tallentamista. Niiden on myös tarjottava käyttäjille mahdollisuus tarkastella, oikaista ja poistaa tietojaan.
• Alueet, joilla on vanhempia laitteita: Alueilla, joilla käyttäjät todennäköisemmin käyttävät vanhempia tai tehottomampia laitteita, sovellusten tulisi olla erityisen tarkkoja tallennustilan käytön suhteen ja optimoida datan tallennus minimoidakseen vaikutuksen laitteen suorituskykyyn.
• Alueet, joilla on erityisiä kielivaatimuksia: Tallennustilan hallinnan käyttöliittymien on oltava täysin lokalisoituja, ottaen huomioon numeroformaatit (esim. pilkkujen tai pisteiden käyttö desimaalierottimina), päivämäärä-/aikamuodot ja oikea tekstin suunta.

Esimerkki: Uutissovellus, joka on suunnattu Intian käyttäjille, saattaisi antaa käyttäjien ladata uutisartikkeleita offline-lukemista varten, tunnustaen mahdollisen ajoittaisen internetyhteyden. Sovellus tarjoaisi myös selkeän tallennustilan hallinnan käyttöliittymän useilla Intian kielillä, jolloin käyttäjät voivat helposti poistaa ladattuja artikkeleita vapauttaakseen tilaa.

Tallennus-API:en tulevaisuus

Persistent Storage API kehittyy jatkuvasti, ja uusia ominaisuuksia ja kyvykkyyksiä lisätään vastaamaan nykyaikaisten verkkosovellusten kasvaviin vaatimuksiin. Joitakin mahdollisia tulevia kehityssuuntia ovat:

• Parannettu tallennuskiintiön hallinta: Yksityiskohtaisempi hallinta tallennuskiintiöön, joka antaa sovellusten kohdentaa tiettyjä tallennusmääriä eri tyyppisille datoille.
• Integrointi pilvitallennustilaan: Saumaton integrointi pilvitallennuspalveluihin, joka antaa sovellusten tallentaa dataa läpinäkyvästi pilveen, kun paikallinen tallennustila on rajallinen.
• Edistynyt datan synkronointi: Kehittyneemmät datan synkronointimekanismit, jotka mahdollistavat sovellusten tehokkaan datan synkronoinnin paikallisen tallennustilan ja pilven välillä.
• Standardoitu tallennustilan salaus: Standardoitu API paikallisesti tallennetun datan salaamiseen, mikä yksinkertaistaa arkaluontoisen datan suojaamista.

Yhteenveto

Persistent Storage API on tehokas työkalu verkkokehittäjille, jotka haluavat rakentaa vakaita ja käyttäjäystävällisiä verkkosovelluksia, jotka voivat tarjota monipuolisia offline-kokemuksia. Ymmärtämällä tallennuskiintiön hallintaa, pyytämällä pysyvää tallennustilaa ja noudattamalla parhaita käytäntöjä datan tallennuksessa ja turvallisuudessa voit luoda sovelluksia, jotka ovat luotettavia, suorituskykyisiä ja kunnioittavat käyttäjän yksityisyyttä. Verkon jatkaessa kehittymistään Persistent Storage API tulee olemaan yhä tärkeämmässä roolissa seuraavan sukupolven verkkosovellusten mahdollistamisessa.

Lisälukemista

• MDN Web Docs: Storage API
• web.dev: Storage for the web
• WICG: Storage Quota API