Commit ace93f8d authored by Guillaume Grossetie's avatar Guillaume Grossetie 🎧
Browse files

remove and optimize images

parent c296e548
......@@ -14,7 +14,7 @@ const DocumentModelConverter = require('./lib/document-model-converter.js')
asciidoctor.ConverterFactory.register(new DocumentModelConverter(), ['json'])
module.exports = function (eleventyConfig, rest) {
eleventyConfig.addPassthroughCopy('pages/**/*.{jpg,png,gif,svg,ico,txt,json,webmanifest,xml}')
eleventyConfig.addPassthroughCopy('pages/**/*.{jpg,png,gif,svg,webp,ico,txt,json,webmanifest,xml}')
eleventyConfig.setBrowserSyncConfig({
files: ['_site/**/*'],
open: false
......
node_modules/
dist/
import { ImagePool } from '@squoosh/lib'
import { cpus } from 'os'
import fs from 'fs/promises'
import { dirname, join, parse } from 'path'
import { fileURLToPath } from 'url'
const __dirname = dirname(fileURLToPath(import.meta.url))
const imagePool = new ImagePool(cpus().length)
const imagesDirectory = join(__dirname, 'img')
const distDirectory = join(__dirname, 'dist')
const imageNames = await fs.readdir(imagesDirectory)
for (let imageName of imageNames) {
if (imageName.endsWith('.png') || imageName.endsWith('.jpeg') || imageName.endsWith('.jpg')) {
console.log(`Processing ${imageName}...`)
const file = await fs.readFile(join(imagesDirectory, imageName))
const image = imagePool.ingestImage(file)
await image.preprocess({
quant: {
numColors: 256,
dither: 1
}
})
await image.encode({ oxipng: { level: 3 }, webp: { quality: 85 } })
const oxipngEncodedImage = await image.encodedWith.oxipng
await fs.writeFile(join(distDirectory, imageName), oxipngEncodedImage.binary)
const webpEncodedImage = await image.encodedWith.webp
await fs.writeFile(join(distDirectory, `${parse(imageName).name}.webp`), webpEncodedImage.binary)
}
}
await imagePool.close();
This diff is collapsed.
{
"name": "asciidoc.org-images",
"private": true,
"version": "1.0.0",
"type": "module",
"description": "",
"keywords": [],
"author": "",
"license": "EPL-2.0",
"devDependencies": {
"@squoosh/lib": "^0.4.0",
"puppeteer": "^13.3.1"
}
}
const asciidoctor = require('@asciidoctor/core')()
const { parse, dirname, join } = require('path')
function encodeAttributeValue(val) {
return val.includes('"') ? val.replaceAll('"', '"') : val
}
class DocumentModelConverter {
constructor () {
......@@ -20,7 +25,6 @@ class DocumentModelConverter {
}
} else if (block.getNodeName() === 'section') {
const id = block.getId()
const tabsBlocks = block.findBy({context: 'example', style: 'tabs'})
const contents = []
const sectionBlocks = block.getBlocks()
const title = block.getTitle()
......@@ -121,6 +125,23 @@ class DocumentModelConverter {
}
return this.result
}
const nodeName = node.getNodeName()
if (nodeName === 'image') {
const target = node.getAttribute('target')
if (target.endsWith('.svg')) {
return this.baseConverter.convert(node, transform)
}
const img = `<img src="${node.getImageUri(target)}" alt=${encodeAttributeValue(node.getAlt())}/>`
const mimeType = target.endsWith('png') ? 'image/png' : 'image/jpeg'
const targetInfo = parse(target)
return `<div class="imageblock">
<picture class="content">
<source srcset="${targetInfo.dir}/${targetInfo.name}.webp" type="image/webp">
<source srcset="${node.getImageUri(target)}" type="${mimeType}">
${img}
</picture>
</div>`
}
return this.baseConverter.convert(node, transform)
}
}
......
......@@ -14,7 +14,9 @@
"lint": "npm run lint:js && npm run lint:css",
"lint:js": "eslint .eleventy.js rollup.config.js pages/assets/js/**.js",
"lint:css": "stylelint 'pages/assets/**/*.css'",
"build": "rollup -c --environment BUILD:production && eleventy --config .eleventy.js",
"build": "npm run build:js && npm run build:site",
"build:js": "rollup -c --environment BUILD:production",
"build:site": "eleventy --config .eleventy.js",
"start": "rollup -c -w & eleventy --serve --config .eleventy.js"
},
"devDependencies": {
......
This diff is collapsed.
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 517 142"><defs><style>.cls-1{fill:#ea2328;}.cls-1,.cls-2{fill-rule:evenodd;}</style></defs><path id="Logo-Icon" class="cls-1" d="M100,81.23a7.07,7.07,0,0,1-6,7.32c-6.84,1.2-21.2,1.93-33.23,1.93s-26.39-.73-33.23-1.93a7.08,7.08,0,0,1-6-7.32V58.44a7.59,7.59,0,0,1,6-7.33A76.79,76.79,0,0,1,38,50.43a2.58,2.58,0,0,1,2.52,2.77V69.14c7.07,0,13.21-.43,20.3-.43s13.23.4,20.29.43V53.2a2.58,2.58,0,0,1,2.52-2.77,76.91,76.91,0,0,1,10.42.68,7.59,7.59,0,0,1,6,7.33Zm-39.2-68.6a58.37,58.37,0,1,0,58,58.37,58.18,58.18,0,0,0-58-58.37Z"/><g id="Logo-Type"><path id="Fill-1" class="cls-2" d="M180.22,99c-18,0-27.05-13.16-27.05-27.64s9.35-27.48,27.22-27.48c6.86,0,11.72,1.51,15.84,4.25l-5.12,8.51a18.68,18.68,0,0,0-10.89-3.1c-9.64,0-14.82,7.79-14.82,17.5,0,10,4.94,18.21,15,18.21a18.32,18.32,0,0,0,11.81-4l4.72,8.19c-2.68,2.45-9,5.61-16.7,5.61"/><path id="Fill-3" class="cls-2" d="M218.6,99c-13.43,0-19.36-10.25-19.36-20.31s5.85-20.58,19.29-20.58,19.58,10.17,19.58,20.24c0,9.91-6,20.65-19.51,20.65m-.21-32.74c-5.78,0-7.64,4.92-7.64,12.09s2.26,12.34,8,12.34,7.83-4.81,7.83-12-2.39-12.43-8.22-12.43"/><path id="Fill-5" class="cls-2" d="M255.12,59V84c0,3.84,1.32,5.75,5,5.75,3.88,0,6.86-3.74,7.64-4.69V59h10.86V86.54a58.36,58.36,0,0,0,1,11.45H269a28.45,28.45,0,0,1-.8-5.17A15.31,15.31,0,0,1,255.81,99c-8.47,0-11.54-5.51-11.54-12.66V59Z"/><path id="Fill-7" class="cls-2" d="M305.22,99c-12.39,0-20.07-8.21-20.07-20.4,0-13.09,8.62-20.49,20.39-20.49,6.22,0,9.94,1.88,11.76,3.08l-3.45,7.51a14,14,0,0,0-8-2.26c-6,0-9.24,4.74-9.24,11.83s3.06,12.24,9.48,12.24a15,15,0,0,0,8.19-2.31l3.29,7.32C315.8,96.65,312.25,99,305.22,99"/><path id="Fill-9" class="cls-2" d="M346.63,98V73c0-3.83-1.32-5.74-4.94-5.74-3.95,0-6.92,3.67-7.71,4.7V98H323.13V40.47H334V63.68a15.71,15.71,0,0,1,12-5.62c8.47,0,11.55,5.47,11.55,12.68V98Z"/><path id="Fill-11" class="cls-2" d="M377.18,40.47V62.08a13.48,13.48,0,0,1,9.38-4c9.55,0,16.31,6.63,16.31,20.15S394,99,382.34,99c-8.77,0-14.12-2.22-16-3.12V40.47Zm0,49.05a14.53,14.53,0,0,0,5.16.84c5.62,0,9-4.15,9-12.15,0-7.2-2.41-11.48-7.88-11.48a8.78,8.78,0,0,0-6.31,2.9Z"/><path id="Fill-13" class="cls-2" d="M429.83,98a22.16,22.16,0,0,1-.65-4.14A13.89,13.89,0,0,1,418.44,99c-6.56,0-11.64-4-11.64-11,0-10.12,10.26-13.86,20.49-13.86h1.32V71.94c0-3.23-1.3-5.21-6.13-5.21a16.09,16.09,0,0,0-9.75,3.64L408,63.7c2.32-2.12,7.44-5.64,15.7-5.64,10.66,0,15.66,4.12,15.66,14.52V86.27A55,55,0,0,0,440.51,98Zm-1.22-17.17h-1.32c-6,0-10.09,1.79-10.09,6.21,0,2.77,2.19,4,4.57,4a9.05,9.05,0,0,0,6.84-3.28Z"/><path id="Fill-15" class="cls-2" d="M458.93,99c-7,0-11.39-2.08-13.75-3.68l3.62-7.66a17.93,17.93,0,0,0,9.47,3.19c4,0,6.19-1.14,6.19-3.36,0-2.55-4.36-3.23-9.81-5.88-5.29-2.59-8.43-5.6-8.43-11.47,0-7.37,5.77-12,14.51-12a23.59,23.59,0,0,1,12.4,3.1l-3.76,7.49a16,16,0,0,0-8.2-2.44c-3.66,0-5.2,1.3-5.2,3.3,0,2.56,3.54,3.18,7.94,5C470,77,474.29,79.84,474.29,86.39c0,8.24-5.81,12.56-15.36,12.56"/><path id="Fill-17" class="cls-2" d="M499.44,90.8a19.44,19.44,0,0,0,10-2.66l3.47,7C510.32,96.65,506.4,99,498.43,99c-12.92,0-20.27-8.17-20.27-20.63s8.46-20.26,19.15-20.26c12.12,0,18,8.53,16.69,23.1H489.77c.51,5.81,3.46,9.64,9.67,9.64Zm4.14-17c-.08-4.31-1.77-7.81-6.43-7.81-4.29,0-6.73,2.78-7.44,7.81Z"/></g></svg>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment