CtrlK
CommunityDocumentationLog inGet started
Tessl Logo

tessl/npm-stencil--core

tessl install tessl/npm-stencil--core@4.36.0

A comprehensive web component compiler that transforms TypeScript and JSX code into standards-compliant web components with complete development toolchain.

Agent Success

Agent success rate when using this tile

75%

Improvement

Agent success rate improvement when using this tile compared to baseline

1.44x

Baseline

Agent success rate without this tile

52%

rubric.jsonevals/scenario-10/

{
  "context": "This criteria evaluates how well the engineer uses Stencil's code splitting and lazy loading features through proper output target configuration, component implementation, and shared code organization.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "dist output target",
      "description": "The stencil.config.ts file includes an outputTargets array with a 'dist' type output target configured for lazy-loadable ES modules",
      "max_score": 25
    },
    {
      "name": "Component decorators",
      "description": "Both user-card and product-card components use the @Component() decorator with proper tag names and the @Prop() decorator for their respective properties (name, email for user-card; name, price for product-card)",
      "max_score": 20
    },
    {
      "name": "Event emission",
      "description": "Both components use @Event() decorator and EventEmitter to emit custom events (userSelected and productSelected) as specified in the requirements",
      "max_score": 15
    },
    {
      "name": "Shared utility usage",
      "description": "The product-card component imports and uses the formatCurrency function from the shared utility file to format the price",
      "max_score": 15
    },
    {
      "name": "Component separation",
      "description": "Each component (user-card and product-card) is defined in its own separate .tsx file following Stencil's component file structure conventions",
      "max_score": 10
    },
    {
      "name": "Shared code organization",
      "description": "The formatCurrency utility is defined in a separate utility/helper file (not within a component) that can be imported by components",
      "max_score": 10
    },
    {
      "name": "Build enablement",
      "description": "The configuration allows the build process to complete and generate output with automatic code splitting enabled (no explicit disabling of code splitting features)",
      "max_score": 5
    }
  ]
}

Version

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@stencil/core@4.36.x
tile.json