Improve performance

frontend/components/LoginForm.vue

@@ -7,7 +7,7 @@
                     :rules="usernameRules"
                     label="Username"
                     required
-                    prepend-icon="mdi-account"
+                    :prepend-icon="mdiAccount"
                 ></v-text-field>
 
                 <v-text-field
@@ -15,7 +15,7 @@
                     :rules="passwordRules"
                     label="Password"
                     required
-                    prepend-icon="mdi-lock"
+                    :prepend-icon="mdiLock"
                     type="password"
                 ></v-text-field>
             </v-card-text>
@@ -35,9 +35,13 @@
 </template>
 
 <script>
+import { mdiLock, mdiAccount } from '@mdi/js'
+
 export default {
     name: 'LoginForm',
     data: () => ({
+        mdiLock,
+        mdiAccount,
         valid: false,
         form: {
             username: '',

frontend/components/Navbar.vue

@@ -5,7 +5,7 @@
         <v-menu bottom left>
             <template v-slot:activator="{ on }">
                 <v-btn aria-label="menu" icon v-on="on">
-                    <v-icon>mdi-dots-vertical</v-icon>
+                    <v-icon>{{ mdiDotsVertical }}</v-icon>
                 </v-btn>
             </template>
 
@@ -25,6 +25,7 @@
 </template>
 
 <script>
+import { mdiDotsVertical } from '@mdi/js'
 import { mapGetters } from 'vuex'
 
 export default {
@@ -32,6 +33,9 @@ export default {
     computed: {
         ...mapGetters(['isAuthenticated', 'loggedInUser']),
     },
+    data: () => ({
+        mdiDotsVertical,
+    }),
     methods: {
         async logout() {
             await this.$auth.logout()

frontend/components/RegisterForm.vue

@@ -7,7 +7,7 @@
                     :rules="usernameRules"
                     label="Username"
                     required
-                    prepend-icon="mdi-account"
+                    :prepend-icon="mdiAccount"
                 ></v-text-field>
 
                 <v-text-field
@@ -15,7 +15,7 @@
                     :rules="emailRules"
                     label="Email"
                     required
-                    prepend-icon="mdi-at"
+                    :prepend-icon="mdiAt"
                 ></v-text-field>
 
                 <v-text-field
@@ -23,7 +23,7 @@
                     :rules="passwordRules"
                     label="Password"
                     required
-                    prepend-icon="mdi-lock"
+                    :prepend-icon="mdiLock"
                     type="password"
                 ></v-text-field>
 
@@ -32,7 +32,7 @@
                     :rules="confirmRules"
                     label="Confirm your password"
                     required
-                    prepend-icon="mdi-lock"
+                    :prepend-icon="mdiLock"
                     type="password"
                 ></v-text-field>
             </v-card-text>
@@ -53,9 +53,14 @@
 </template>
 
 <script>
+import { mdiLock, mdiAccount, mdiAt } from '@mdi/js'
+
 export default {
     name: 'RegisterForm',
     data: () => ({
+        mdiLock,
+        mdiAccount,
+        mdiAt,
         valid: false,
         form: {
             username: '',