CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-vant

Mobile UI Components library built on Vue 3 with 100+ components

74

1.07x
Overview
Eval results
Files

rubric.jsonevals/scenario-3/

{
  "context": "This criteria evaluates how well the engineer uses Vant's Image component to implement a product gallery with lazy loading. The focus is on proper usage of the Image component's lazy loading, fit modes, error handling, and loading state features.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "Image Component Usage",
      "description": "Uses Vant's van-image component (or Image component) to render product images instead of native img tags",
      "max_score": 25
    },
    {
      "name": "Lazy Loading",
      "description": "Enables lazy loading on images using the 'lazyLoad' prop (or 'lazy-load' in template) on van-image component",
      "max_score": 25
    },
    {
      "name": "Fit Mode",
      "description": "Configures the 'fit' prop on van-image to 'cover' mode for proper image scaling",
      "max_score": 15
    },
    {
      "name": "Loading Placeholder",
      "description": "Implements loading placeholder using 'showLoading' prop (default true) or custom 'loading' slot on van-image",
      "max_score": 15
    },
    {
      "name": "Error Placeholder",
      "description": "Implements error placeholder using 'showError' prop (default true) or custom 'error' slot on van-image for failed image loads",
      "max_score": 20
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-vant

tile.json