web-dev-qa-db-fra.com

En quoi Stencil est-il différent de React et Angular?

Je connais Angular et je connais les bases de React. J'explorais stencil docs , j'ai trouvé que le composant stencil avait à la fois @Component Décorateur et fonction render() une fonction-

component.tsx 

import { Component, Prop } from '@stencil/core';

@Component({
    tag: 'my-first-component',
    styleUrl: 'my-first-component.scss'
})
export class MyComponent {
    // Indicate that name should be a public property on the component
    @Prop() firstName: string;

    render() {
        return (
            <p>
            My name is {this.firstName}
            </p>
        );
    }
}

Aidez-moi à comprendre que comment il est différent de angular et comment réagir et comment cela fonctionne?

reactjsionic-frameworkstenciljsstencil-compilerstencil-component
23
Swapnil Patwa

Stencil n'est pas un framework, c'est juste un compilateur qui transforme les classes avec des décorateurs en composants Web standard. Cela signifie que vous pouvez générer une collection de composants de gabarit et les utiliser sans problème dans Angular, React, Vue ou Polymer).

Fondamentalement, Stencil combine certaines des meilleures fonctionnalités des frameworks traditionnels, mais génère des éléments personnalisés 100% conformes aux normes, c'est pourquoi vous avez @Component (Angular), méthode de rendu (React) ...

Pour créer votre premier composant, je vous suggère de lire docs à propos de votre premier composant. Vous y avez tout expliqué :)

25
Fernando Del Olmo

Stencil est un compilateur développé par Ionic Developers qui crée des composants Web personnalisés.

  • Stencil utilise les technologies standard derrière le nom des composants Web (modèles HTML, éléments personnalisés et DOM fantôme).
  • Contient les meilleures fonctionnalités de Angular, React, Vue and Polymer.

Le compilateur Stencil produit du Vanilla JavaScript, sans aucune dépendance et fournit toujours les fonctionnalités suivantes.

  1. Une minuscule couche DOM virtuelle
  2. Liaison de données unidirectionnelle efficace
  3. Chargement paresseux
  4. Rendu côté serveur

Donc, l'idée derrière Stencil ne se concentre pas sur la partie du framework comme Angular ou React mais pour créer des collections de composants qui peuvent être utilisés indépendamment d'un framework.

14
abhishek gangwar

Regardez le talk des Ionic membres de l'équipe au Polymer Summit, il explique assez bien le but de Stencil).

Fondamentalement, ce n'est pas un framework comme Angular ou React, c'est un compilateur qui vous aide à créer des composants Web conformes aux spécifications qui s'exécutent dans tous les navigateurs prenant en charge les composants Web (ou presque tous les navigateurs utilisant polyfills ).
Vous n'avez pas besoin de framework pour utiliser ces composants, mais vous pouvez les utiliser également avec n'importe quel framework, ce qui est l'énorme avantage de composants Web.
Vous ne pouvez pas utiliser un composant Angular dans React mais vous pouvez utiliser un composant créé avec Stencil avec Angular ou React ou Vue ou sans cadre du tout).

8
David

Tout d'abord, stencil est un compilateur qui compile le composant Web de stencil (tsx) vers le javascript Vanilla sans aucune dépendance.

La question curieuse est de savoir si nous n'utilisons pas angular, vue etc.

Même s'il est possible de faire une application entière avec un pochoir, l'idée est de rendre le composant individuel indépendant du framework. Vous pouvez les utiliser dans n'importe quel cadre ou utiliser indépendamment.

Pour que vous n'ayez pas à vous soucier de changer de framework (angulaire, vue etc.) d'une version à une version supérieure.

2
Himanshu sharma