Upgrade 11ty-img library, change image quality settings

Author: einomi

.eleventy.js

@@ -26,12 +26,12 @@ function imageShortcode(src, attributes = {}, maxWidth = 2636) {
     urlPath: '/images/',
     outputDir: './dist/images/',
     sharpAvifOptions: {
-      quality: 60,
-      effort: 9,
+      quality: 55,
+      effort: 5,
       chromaSubsampling: '4:2:0',
     },
     sharpWebpOptions: {
-      quality: 70,
+      quality: 65,
       alphaQuality: 77,
       chromaSubsampling: '4:2:0',
     },

README.md

@@ -53,6 +53,10 @@ Create components at least for the parts of the UI that appear in multiple place
 
 It is recommended that you will keep your components inside the `src/components/` folder. This starter kit allows you to keep your markup, styles, and JavaScript code for a component in one folder and then to use them in multiple places. Please, see the `src/components/` folder for examples. Notice how different types of components are arranged. Also, It is not absolutely mandatory to include Nunjucks or JS code for a component if you feel that it doesn't make too much sense. For example, when the markup is quite simple or when a component doesn't have JS logic.
 
+## Image Quality Settings
+
+You can change image compression settings for avif, webp, jpeg in .eleventy.js file
+
 ## TypeScript
 
 This boilerplate supports TypeScript, however it is completely optional to use it for development. For TypeScript support, it was decided to use JSDoc notation ([officially supported TypeScript syntax](https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html)) because it does not make you to write .ts files with TS syntax, with this approach you can continue to write .js files with JS syntax and JSDoc notation for TypeScript support. Also, in this case you can easily disable TypeScript if you do not need it at some point of your development process. (for example, to speed up the development or if you have new developers on a project that are not familiar with TypeScript)

package.json

@@ -32,8 +32,7 @@
   "license": "ISC",
   "dependencies": {
     "@11ty/eleventy": "^1.0.0",
-    "@11ty/eleventy-cache-assets": "^2.1.0",
-    "@11ty/eleventy-img": "^0.8.2",
+    "@11ty/eleventy-img": "^2.0.1",
     "@11ty/eleventy-plugin-syntaxhighlight": "^3.0.6",
     "@babel/core": "^7.13.1",
     "@babel/plugin-proposal-class-properties": "^7.13.0",