Spinner "fryser" ved rendering af indhold

[cjessing]

Ved indlæsning af store mængder data (i det konkrete tilfælde godt 22.000 rækker, der fylder ca. 8.3Mb) snurrer spinneren fint mens data hentes fra backenden. Løsningen er en traditionel Angular løsning men mens data behandles internt (opbygning af data i et array til visning i en tabel) "hænger" eller "fryser" spinneren. Det kan være op imod fem sekunder.

Hvis jeg i stedet for jeres keyframes benytter

@keyframes spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg);} }

så spinner den hele tiden, men ser naturligvis anderledes ud.

Hvordan undgår jeg at jeres spinner stopper under rendering?

Desktop OS: Windoze 10 Browser: Chrome, Edge, FF Version: Latest stable

[detfaellesdesignsystem]

Hej @cjessing

Tak for henvendelsen!

Vi har oprettet en sag på det og vil vende tilbage, når vi har kigget nærmere på det.

Med venlig hilsen Helle Juhl Det Fælles Designsystem

[detfaellesdesignsystem]

Hej @cjessing

Jeg får ikke nogen synlig spinner med den kode, du har vedhæftet. Spinneren er udelukkende lavet med CSS, så det virker spøjst, hvis der er specifik styling, som får den til at fryse.

For at forsøge at afdække problemet, kan jeg få dig til at erstatte spinneren i css-filen med nedenstående kode i stedet? Denne spinner er blot til fejlsøgning, så det er ikke et permanent fix, hvis det skulle virke:

.spinner {
  margin: 20px auto;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  border: 6px solid #454545;
  border-bottom-color: transparent;
  -webkit-animation: spinner 1.1s infinite linear;
  animation: spinner 1.1s infinite linear;
}

@keyframes spinner {
  0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

Med venlig hilsen Helle Juhl Det Fælles Designsystem