updates and performance optim

Author: dwightjack

package-lock.json

@@ -4,26 +4,25 @@
   "description": "Fevr static website",
   "main": "index.js",
   "scripts": {
-    "frontend": "gulp",
     "serve": "eleventy --serve",
     "build": "eleventy"
   },
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com:fevrcoding/fevrcoding.github.io.git"
   },
-  "author": "Luca 'Kino' Maroni",
+  "author": "FEVR",
   "license": "ISC",
   "homepage": "https://github.com/fevrcoding/fevrcoding.github.io",
   "devDependencies": {
-    "@11ty/eleventy": "^0.10.0",
+    "@11ty/eleventy": "^0.11.1",
     "@11ty/eleventy-plugin-rss": "^1.0.7",
-    "eslint": "^6.8.0",
-    "eslint-config-prettier": "^6.10.0",
+    "eslint": "^7.16.0",
+    "eslint-config-prettier": "^7.1.0",
     "eslint-plugin-node": "^11.0.0",
     "eslint-plugin-prettier": "^3.1.2",
     "js-yaml": "^3.13.1",
     "luxon": "^1.22.0",
-    "prettier": "^1.19.1"
+    "prettier": "^2.2.1"
   }
 }

package.json

@@ -86,24 +86,18 @@
 <!--<meta name="msapplication-TileImage" content="/favicon270.png">-->
 
 <!-- CSS -->
-{# <link rel="stylesheet" href="/css/owl.carousel.css"/> #}
+<link rel="preconnect" href="https://fonts.gstatic.com">
+<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;1,100;1,300;1,400;1,500;1,700&family=Volkhov:ital@1&display=swap" rel="stylesheet">
 <link rel="stylesheet" href="/css/bootstrap.min.css"/>
-<link rel="stylesheet" href="/css/font-awesome.min.css"/>
 <link rel="stylesheet" href="/css/airspace.css"/>
 <link rel="stylesheet" href="/css/style.css"/>
-{# <link rel="stylesheet" href="/css/ionicons.min.css"/> #}
-<link rel="stylesheet" href="/css/animate.css"/>
-<link rel="stylesheet" href="/css/responsive.css"/>
-{# <link rel="stylesheet" href="/css/syntax.css"/> #}
-
+{% for stylesheet in ['font-awesome.min.css', 'animate.css', 'responsive.css' ] %}
+    <link rel="preload" href="/css/{{stylesheet}}" as="style" onload="this.onload=null;this.rel='stylesheet'">
+    <noscript><link rel="stylesheet" href="/css/{{stylesheet}}"></noscript>
+{% endfor %}
 <!-- Js -->
 <script defer src="/js/vendor/jquery-1.10.2.min.js"></script>
 <script defer src="/js/bootstrap.min.js"></script>
-{# <script defer src="/js/owl.carousel.min.js"></script> #}
-{# <script defer src="/js/plugins.js"></script> #}
-{# <script defer src="/js/min/waypoints.min.js"></script> #}
-{# <script defer src="/js/jquery.counterup.js"></script> #}
-{# <script defer src="/js/main.js"></script> #}
 {%- if isHome %}
     <script  defer src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
 {%- endif %}

src/_includes/head.njk

@@ -50,7 +50,7 @@ isHome: true
                 <li class="col-sm-3 col-xs-12 evento-item-wrapper">
                   <a class="evento-item slide-down-hover" href="{{ post.url }}">
                     <span class="evento-img">
-                      <img class="img-rounded img-responsive center-block" src="{{ post.data.image }}" alt="">
+                      <img class="img-rounded img-responsive center-block" src="{{ post.data.image }}" alt="" loading="lazy">
                     </span>
                     <span role="heading" aria-level="3" class="evento-title line">{{post.data.title | upper }}</span>
                     <span class="evento-description">{{ post.data.event.speaker }} - 
@@ -86,7 +86,7 @@ isHome: true
                 <div class="col-lg-3 col-sm-3 col-xs-12 team-box">
                   <div class="team-member">
                     <figure class="profile-pic">
-                      <img class="img-responsive center-block img-circle" src="/{{member.img | url }}" alt="Foto di {{member.name}}">
+                      <img class="img-responsive center-block img-circle" src="/{{member.img | url }}" alt="Foto di {{member.name}}" loading="lazy">
                     </figure>
                     <div class="member-details">
                       <h3 class="dark-text red-border-bottom">{{member.name | upper }}</h3>
@@ -153,7 +153,7 @@ isHome: true
         <div class="col-sm-6 col-md-3">
           <a class="sponsor-item slide-down-hover" href="{{sp.url}}" target="_blank">
             <span class="sr-only">{{ sp.name }}</span>
-            <img src="/{{sp.img}}" class="img-circle img-responsive center-block" alt="">
+            <img src="/{{sp.img}}" class="img-circle img-responsive center-block" alt="" loading="lazy">
           </a>
         </div>
       {% endfor %}

src/index.njk

@@ -6,9 +6,6 @@
  * 
  */
 
-@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600);
-@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700);
-@import url(https://fonts.googleapis.com/css?family=Volkhov:400italic);
 /* var text-decoration */
 /*--
 	Common Css