diff --git a/example/compare.js b/example/compare.js
new file mode 100644
index 00000000..023f2d52
--- /dev/null
+++ b/example/compare.js
@@ -0,0 +1,70 @@
+const fs = require('fs').promises
+const { join } = require('path')
+const { performance } = require('perf_hooks')
+
+const { render } = require('../index')
+const sharp = require('sharp')
+const { createCanvas, Image } = require('@napi-rs/canvas')
+
+async function main() {
+  const svg = await fs.readFile(join(__dirname, './anime_girl.svg'))
+  const svgString = svg.toString('utf-8')
+  const t0 = performance.now()
+  const pngData = render(svgString, {
+    fitTo: {
+      mode: 'width',
+      value: 2104,
+    },
+    font: {
+      loadSystemFonts: false, // It will be faster to disable loading system fonts.
+    },
+    logLevel: 'off',
+  })
+  const t1 = performance.now()
+  console.log('✨ resvg-js done in', t1 - t0, 'ms')
+  await fs.writeFile(join(__dirname, './out-resvg-js.png'), pngData)
+  
+  sharpToPng('example/anime_girl.svg', 2104)
+  skrCanvas(svg, 2104, 1488)
+}
+
+async function sharpToPng(file, width) {
+  const t0 = performance.now()
+  await sharp(file, {
+    density: 100,
+  })
+    .resize(width)
+    // .flatten({ background: '#fff' })
+    .toFile('example/out-sharp.png')
+  const t1 = performance.now()
+  console.log('✨ sharp done in', t1 - t0, 'ms')
+}
+
+async function skrCanvas(file, width, height) {
+  const t0 = performance.now()
+
+  const image = new Image()
+  image.src = file
+
+  const w = width
+  const h = height
+
+  // resize SVG
+  image.width = w
+  image.height = h
+
+  // create a canvas of the same size as the image
+  const canvas = createCanvas(w, h)
+  const ctx = canvas.getContext('2d')
+
+  // fill the canvas with the image
+  ctx.drawImage(image, 0, 0)
+  var pngData = await canvas.encode('png')
+  const t1 = performance.now()
+
+  console.log('✨ skr-canvas done in', t1 - t0, 'ms')
+
+  await fs.writeFile(join(__dirname, './out-skr-canvas.png'), pngData)
+}
+
+main()
diff --git a/example/index.js b/example/index.js
index 3c6a572b..f0898bbb 100644
--- a/example/index.js
+++ b/example/index.js
@@ -1,77 +1,33 @@
-const fs = require('fs').promises
+const { promises } = require('fs')
 const { join } = require('path')
 const { performance } = require('perf_hooks')
 
 const { render } = require('../index')
-const sharp = require('sharp')
-const { createCanvas, Image } = require('@napi-rs/canvas')
 
 async function main() {
-  // const svg = await fs.readFile(join(__dirname, './text.svg'))
-  const svg = await fs.readFile(join(__dirname, './anime_girl.svg'))
+  const svg = await promises.readFile(join(__dirname, './text.svg'))
   const svgString = svg.toString('utf-8')
   const t0 = performance.now()
   const pngData = render(svgString, {
-    // background: 'rgba(238, 235, 230, .9)',
+    background: 'rgba(238, 235, 230, .9)',
     fitTo: {
-      mode: 'zoom',
-      value: 2,
+      mode: 'width',
+      value: 1200,
     },
     font: {
-      loadSystemFonts: true, // It will be faster to disable loading system fonts.
-      fontFiles: [
-        './example/SourceHanSerifCN-Light-subset.ttf',
-      ], // Load custom fonts.
+      fontFiles: ['./example/SourceHanSerifCN-Light-subset.ttf'], // Load custom fonts.
+      loadSystemFonts: false, // It will be faster to disable loading system fonts.
+      defaultFontFamily: 'Source Han Serif CN Light',
     },
     // imageRendering: 1,
     // shapeRendering: 2,
-    logLevel: 'off',
+    logLevel: 'debug',
   })
   const t1 = performance.now()
-  console.log('✨ resvg-js done in', t1 - t0, 'ms')
-  await fs.writeFile(join(__dirname, './out-resvg-js.png'), pngData)
-  
-  sharpToPng('example/anime_girl.svg', 1052)
-  skrCanvas(svg, 1052, 744)
-}
-
-async function sharpToPng(file, width) {
-  const t0 = performance.now()
-  await sharp(file, {
-    density: 100,
-  })
-    .resize(width)
-    // .flatten({ background: '#fff' })
-    .toFile('example/out-sharp.png')
-  const t1 = performance.now()
-  console.log('✨ sharp done in', t1 - t0, 'ms')
-}
-
-async function skrCanvas(file, width, height) {
-  const t0 = performance.now()
-
-  const image = new Image()
-  image.src = file
-
-  const w = width
-  const h = height
-
-  // resize SVG
-  image.width = w
-  image.height = h
-
-  // create a canvas of the same size as the image
-  const canvas = createCanvas(w, h)
-  const ctx = canvas.getContext('2d')
-
-  // fill the canvas with the image
-  ctx.drawImage(image, 0, 0)
-  var pngData = await canvas.encode('png')
-  const t1 = performance.now()
-
-  console.log('✨ skr-canvas done in', t1 - t0, 'ms')
+  // eslint-disable-next-line no-console
+  console.log('✨ Done in', t1 - t0, 'ms')
 
-  await fs.writeFile(join(__dirname, './out-skr-canvas.png'), pngData)
+  await promises.writeFile(join(__dirname, './text-out.png'), pngData)
 }
 
-main()
+main()
\ No newline at end of file
diff --git a/example/out-sharp.png b/example/out-sharp.png
index 2c9cb368..9b293e61 100644
Binary files a/example/out-sharp.png and b/example/out-sharp.png differ
diff --git a/example/out-skr-canvas.png b/example/out-skr-canvas.png
index 35eeb585..fa967a68 100644
Binary files a/example/out-skr-canvas.png and b/example/out-skr-canvas.png differ