diff --git a/components/LiveStatsTable.vue b/components/LiveStatsTable.vue
index c4c0752..0b4ec09 100644
--- a/components/LiveStatsTable.vue
+++ b/components/LiveStatsTable.vue
@@ -10,6 +10,7 @@
       </small>
     </v-card-title>
     <v-data-table
+      :loading="loading"
       :headers="chartHeaders"
       :items="nodes"
       class="elevation-1"
@@ -23,6 +24,9 @@
       :no-results-text="$t('liveStats.noResults')"
       :disable-pagination="true"
     >
+      <template #loading>
+        <v-skeleton-loader type="table-row@3"></v-skeleton-loader>
+      </template>
       <template #expanded-item="{ headers, item }">
         <td :colspan="headers.length">
           <v-list dense>
@@ -182,6 +186,9 @@ export default {
     locale() {
       return this.$i18n.locale
     },
+    loading() {
+      return this.nodes.length === 0
+    },
     chartHeaders() {
       return [
         {
diff --git a/components/NodeOperatorsTable.vue b/components/NodeOperatorsTable.vue
index 562eeb2..b4c6e9b 100644
--- a/components/NodeOperatorsTable.vue
+++ b/components/NodeOperatorsTable.vue
@@ -1,7 +1,7 @@
 <template>
-  <v-card tile>
+  <v-card tile class="mx-sm-1 mx-0">
     <v-card-title>
-      <template v-if="!isMobile">
+      <template>
         <v-icon :aria-label="title" role="img" aria-hidden="false" class="mr-2"
           >mdi-account</v-icon
         >
diff --git a/components/TableChartCard.vue b/components/TableChartCard.vue
index a6354f1..80d5b7a 100644
--- a/components/TableChartCard.vue
+++ b/components/TableChartCard.vue
@@ -1,76 +1,79 @@
 <template>
-  <v-card tile>
+  <v-card tile class="table-chart-card">
     <div class="d-flex flex-no-wrap justify-space-between">
       <div :class="{ 'w-100': isMobile, 'w-auto': !isMobile }">
         <v-card-title>
           <v-icon class="mr-1">{{ icon }}</v-icon>
           {{ title }}
         </v-card-title>
-        <v-simple-table style="width: 100%">
-          <template #default>
-            <thead>
-              <tr>
-                <th class="text-left">{{ $t('home.totalNodes') }}</th>
-                <th class="text-right" :colspan="inlineColsNumber">
-                  {{ total }} (100%)
-                </th>
-              </tr>
-              <template v-if="inlineColNames.length > 0">
+        <v-skeleton-loader :loading="loading" type="table-heading,text@3">
+          <v-simple-table style="width: 100%">
+            <template #default>
+              <thead>
                 <tr>
-                  <th class="text-left"></th>
-                  <th
-                    v-for="name of inlineColNames"
-                    :key="name"
-                    class="text-right"
-                  >
-                    {{ name }}
+                  <th class="text-left">{{ $t('home.totalNodes') }}</th>
+                  <th class="text-right" :colspan="inlineColsNumber">
+                    {{ total }}
                   </th>
                 </tr>
-              </template>
-            </thead>
-            <tbody>
-              <tr v-for="(count, name) of table" :key="name">
-                <template v-if="!to">
-                  <td class="text-left">
-                    {{ name === '-' ? noLabelText : name }}
-                  </td>
-                </template>
-                <template v-else>
-                  <td class="text-left">
-                    <nuxt-link :to="'/' + to + '/' + name">
+                <template v-if="inlineColNames.length > 0">
+                  <tr>
+                    <th class="text-left"></th>
+                    <th
+                      v-for="name of inlineColNames"
+                      :key="name"
+                      class="text-right"
+                    >
                       {{ name }}
-                    </nuxt-link>
-                  </td>
-                </template>
-                <template v-if="typeof count === 'object'">
-                  <td
-                    v-for="num of Object.values(count)"
-                    :key="`${name}/${num}`"
-                    class="text-right"
-                  >
-                    {{ num }} ({{
-                      percent(num, rowTotal(Object.values(count)))
-                    }}%)
-                  </td>
+                    </th>
+                  </tr>
                 </template>
-                <template v-else>
-                  <td class="text-right">
-                    {{ count }} ({{ percent(count, total) }}%)
-                  </td>
-                </template>
-              </tr>
-            </tbody>
-          </template>
-        </v-simple-table>
+              </thead>
+              <tbody>
+                <tr v-for="(count, name) of table" :key="name">
+                  <template v-if="!to">
+                    <td class="text-left">
+                      {{ name === '-' ? noLabelText : name }}
+                    </td>
+                  </template>
+                  <template v-else>
+                    <td class="text-left">
+                      <nuxt-link :to="'/' + to + '/' + name">
+                        {{ name }}
+                      </nuxt-link>
+                    </td>
+                  </template>
+                  <template v-if="typeof count === 'object'">
+                    <td
+                      v-for="num of Object.values(count)"
+                      :key="`${name}/${num}`"
+                      class="text-right"
+                    >
+                      {{ num }} ({{
+                        percent(num, rowTotal(Object.values(count)))
+                      }}%)
+                    </td>
+                  </template>
+                  <template v-else>
+                    <td class="text-right">
+                      {{ count }} ({{ percent(count, total) }}%)
+                    </td>
+                  </template>
+                </tr>
+              </tbody>
+            </template>
+          </v-simple-table>
+        </v-skeleton-loader>
       </div>
-      <apexchart
-        v-if="!isMobile"
-        width="256"
-        type="pie"
-        :options="getChartOptions()"
-        :series="series"
-        class="my-3"
-      ></apexchart>
+      <v-skeleton-loader :loading="loading" type="avatar" class="my-3">
+        <apexchart
+          v-if="!isMobile"
+          max-width="256"
+          type="pie"
+          :options="getChartOptions()"
+          :series="series"
+        ></apexchart>
+      </v-skeleton-loader>
     </div>
   </v-card>
 </template>
@@ -140,6 +143,9 @@ export default {
     locale() {
       return this.$i18n.locale
     },
+    loading() {
+      return !this.series || this.series.length === 0
+    },
     options() {
       const self = this
       return {
@@ -198,3 +204,17 @@ export default {
   },
 }
 </script>
+<style lang="scss" scoped>
+.table-chart-card {
+  :deep(.v-skeleton-loader__avatar) {
+    width: 200px;
+    height: 200px;
+    aspect-ratio: 1;
+    margin-right: 12px;
+  }
+
+  :deep(.apexcharts-canvas) {
+    min-width: 254px;
+  }
+}
+</style>
diff --git a/pages/fork/_name.vue b/pages/fork/_name.vue
index a1b2686..a7afee6 100644
--- a/pages/fork/_name.vue
+++ b/pages/fork/_name.vue
@@ -1,49 +1,39 @@
 <template>
-  <v-skeleton-loader
-    type="table-heading, list-item-three-line, divider, table-thead, list-item-three-line, divider, list-item@4"
-    :loading="$fetchState.pending"
-  >
-    <v-container fluid :class="{ 'pa-1': isMobile }">
-      <v-row>
-        <v-col cols="12" :class="{ 'pa-1': isMobile }">
-          <ForkCountdownCard
-            :latest-block-number="liveStats.latestBlockNumber"
-          />
-        </v-col>
-      </v-row>
-      <v-row>
-        <v-col cols="12" :class="{ 'pa-1': isMobile }">
-          <LiveStatsTable
-            :nodes="liveStats.raw"
-            :last-updated="liveStats.now"
-            :title="$t('liveStats.title')"
-          />
-        </v-col>
-      </v-row>
-      <v-row>
-        <v-col cols="12" md="6" :class="{ 'pa-1': isMobile }">
-          <ForkClientUpgraded :nodes="nodes" />
-        </v-col>
-        <v-col cols="12" md="6" :class="{ 'pa-1': isMobile }">
-          <NodeOperatorsUpgradedCard :operators="operators" />
-        </v-col>
-      </v-row>
-      <v-row>
-        <v-col
-          v-for="(categoryOperators, category) in operators.raw"
-          :key="category"
-          cols="12"
-          md="6"
-          :class="{ 'pa-1': isMobile }"
-        >
-          <NodeOperatorsTable
-            :operators="categoryOperators"
-            :title="category"
-          />
-        </v-col>
-      </v-row>
-    </v-container>
-  </v-skeleton-loader>
+  <v-container fluid :class="{ 'pa-1': isMobile }">
+    <v-row>
+      <v-col cols="12" :class="{ 'pa-1': isMobile }">
+        <ForkCountdownCard :latest-block-number="liveStats.latestBlockNumber" />
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="12" :class="{ 'pa-1': isMobile }">
+        <LiveStatsTable
+          :nodes="liveStats.raw"
+          :last-updated="liveStats.now"
+          :title="$t('liveStats.title')"
+        />
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="12" md="6" :class="{ 'pa-1': isMobile }">
+        <ForkClientUpgraded :nodes="nodes" />
+      </v-col>
+      <v-col cols="12" md="6" :class="{ 'pa-1': isMobile }">
+        <NodeOperatorsUpgradedCard :operators="operators" />
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col
+        v-for="(categoryOperators, category) in operators.raw"
+        :key="category"
+        cols="12"
+        md="6"
+        :class="{ 'pa-1': isMobile }"
+      >
+        <NodeOperatorsTable :operators="categoryOperators" :title="category" />
+      </v-col>
+    </v-row>
+  </v-container>
 </template>
 
 <script>
diff --git a/store/liveStats.js b/store/liveStats.js
index 20a577d..c4b8d47 100644
--- a/store/liveStats.js
+++ b/store/liveStats.js
@@ -3,7 +3,7 @@ import config from '~/params/config.json'
 import { parseNodeVersion } from '~/utils'
 
 export const state = () => ({
-  raw: {},
+  raw: [],
   latestBlockNumber: 0,
   now: new Date(),
   intervalTimer: null,
diff --git a/store/nodes.js b/store/nodes.js
index d3c3ea4..46628da 100644
--- a/store/nodes.js
+++ b/store/nodes.js
@@ -6,8 +6,8 @@ import { parseNodeVersion } from '~/utils'
 export const state = () => ({
   raw: [], // full list of nodes (all data) (used by nodes page)
   clients: {}, // data for clients table (used by home page)
-  clientsForkAdoption: {}, // data for clients fork adoption chart (used by fork page)
-  forks: {}, // data for forkIds table (used by home page)
+  clientsForkAdoption: { table: {}, chart: { series: [], labels: [] } }, // data for clients fork adoption chart (used by fork page)
+  forks: { table: {}, chart: { series: [], labels: [] } }, // data for forkIds table (used by home page)
   countries: {}, // country data for heat map
   protocols: {
     eth: {},
diff --git a/store/operators.js b/store/operators.js
index 825ed28..b79a2a3 100644
--- a/store/operators.js
+++ b/store/operators.js
@@ -3,7 +3,7 @@ import config from '~/params/config.json'
 
 export const state = () => ({
   raw: {}, // full list of nodes (all data) (used by nodes page)
-  upgradedOperators: {}, // data for operators upgraded stats chart
+  upgradedOperators: { total: 0, table: {}, chart: { series: [], labels: [] } }, // data for operators upgraded stats chart
   updated: false,
 })