update index.js

index.js

@@ -6,6 +6,8 @@ const imageContainer = document.getElementById('image-container');
 const outputContainer = document.getElementById('output-container');
 
 status.textContent = 'Loading model...';
+let startTime = null;
+let endTime = null;
 
 // Load model and processor
 const model = await AutoModel.from_pretrained('Xenova/modnet-onnx', { quantized: false });
@@ -46,9 +48,9 @@ fileSelect.addEventListener('change', function (e) {
 });
 
 async function start(source) {
+  startTime = new Date();
   status.textContent = 'processing';
   console.log('start process')
-  const startTime = new Date();
 
   const image = await RawImage.read(source);
   // Process image
@@ -62,9 +64,6 @@ async function start(source) {
   const matteImage = await RawImage.fromTensor(output[0].mul(255).to('uint8')).resize(image.width, image.height);
 
   console.log('matteImage', matteImage, output)
-  const endTime = new Date();
-  const diff = (endTime - startTime) / 1000
-  setTimeout(() => status.textContent = 'Finish: ' + diff + 's', 100)
 
   async function renderRawImage(image) {
     let rawCanvas = await image.toCanvas();
@@ -115,6 +114,9 @@ async function start(source) {
 
       // 将图片添加到 body 中或者其他 HTML 元素
       outputContainer.appendChild(img);
+      endTime = new Date();
+      const diff = (endTime - startTime) / 1000
+      setTimeout(() => status.textContent = 'Finish: ' + diff + 's', 0)    
     })
     .catch(function (error) {
       // 捕获和处理 blob 创建过程中可能出现的错误