Update (seo)

Add (lqip)

resources/css/app-front.css

@@ -19,3 +19,19 @@ .nav-scroller .nav {
 .hover-text-decoration-underline:hover {
   text-decoration: underline !important;
 }
+
+/* lqip start */
+
+img {
+  transition: opacity 0.5s ease;
+}
+img.lqip-blur {
+  opacity: 1; /* or any value less than 1 to make it slightly transparent */
+}
+
+img.lqip-blur {
+  filter: blur(20px);
+  -webkit-filter: blur(20px);
+}
+
+/* lqip end */

resources/js/vue/front/LqipLoader.vue

@@ -0,0 +1,25 @@
+<template>
+  <!-- Empty template -->
+</template>
+
+<script>
+export default {
+  name: "LqipLoader",
+  mounted() {
+    this.initLqipLoading();
+  },
+  methods: {
+    initLqipLoading() {
+      const imgDefer = document.getElementsByTagName("img");
+      for (let i = 0; i < imgDefer.length; i++) {
+        if (imgDefer[i].getAttribute("data-src")) {
+          imgDefer[i].onload = function () {
+            this.classList.remove("lqip-blur");
+          };
+          imgDefer[i].setAttribute("src", imgDefer[i].getAttribute("data-src"));
+        }
+      }
+    },
+  },
+};
+</script>

resources/views/front/layouts/app.blade.php

@@ -11,6 +11,7 @@
             @yield('content')
         </main>
         @include('front.layouts.partials.footer')
+        <lqip-loader></lqip-loader>
     </div>
 </body>
 

resources/views/vendor/googletagmanager/head.blade.php

@@ -1,6 +1,5 @@
-
 @if ($enabled)
-    <link rel="preconnect" href="https://www.googletagmanager.com"/>
+    <link rel="preconnect" href="https://www.googletagmanager.com" />
     <script>
         window.dataLayer = window.dataLayer || [];
         @unless (empty($dataLayer->toArray()))