I componenti Web in HTML aggiungeranno troppa complessità? [chiuso]

Question

I componenti Web in HTML aggiungeranno troppa complessità? [chiuso]

#1 da (1 voti)
#2 da (0 voti)

1

Il modo in cui sono stato abituato alle interfacce utente è vedere tutto come div. Dove un div è essenzialmente una scatola e possono essere stilizzati in CSS.

<div class='container'>
   <div class='header'></div>
   <div class='mainbody'>
       <div class='someusercontrol'>
       </div>
   </div>
   </div class='footer'></div>
</div>

Ma al giorno d'oggi sembra che si tratti di React e Angular Directives e ora con le componenti Web Components si stanno lentamente spostando su:

<container>
     <header></header>
     <mainbody>
             <someusercontrol someattribute='123'>
             </someusercontrol>
     </mainbody>
     <footer></footer>
</container>

Il problema che vedo con il secondo esempio è che ora tutti gli elementi sono eterogenei rispetto a quelli omogenei con div. Ogni elemento può avere attributi / proprietà differenti e può funzionare in modi diversi. Ciò può comportare complessità quando si visualizza il codice di qualcun altro per la prima volta, poiché ognuna di queste "cose" funziona in modo diverso.

Ma alcuni sostengono che ora gli elementi saranno più modulari e più facili da riutilizzare. Ma mi chiedo se ne valga la pena. I componenti web sono davvero la strada da percorrere? Sembra che il futuro indichi che lo sono.

html javascript client-side user-interface

posta foreyez 23.12.2015 - 20:04

fonte

2 risposte

Leggi altre domande sui tag html javascript client-side user-interface

Determinare in modo efficiente la relazione sottoinsieme molti a molti MVC Imposta o leggi i componenti di visualizzazione

score 1 · Answer 1

Credo che ciò che stai chiedendo sia basato sulla preferenza personale di una persona o su un particolare livello di quando qualcuno pensa che qualcosa sia "troppo complesso" per loro.

Ora per me personalmente, non penso che aggiunga abbastanza complessità per non usarlo. Ad esempio, jquery.validate.js in VS2015 (utilizzando NuGet Package Manager) è eccezionale e mi ha salvato un po 'di tempo. Per me, questo è quello che si riduce a. Mi fa risparmiare tempo, anche se è un po '? Sì? Lo imparo No? No grazie, a meno che non ci sia qualche altra ricompensa da qualche altra parte. Per esempio: <asp:DropDownList ID="status" runat="server" CssClass="form-control" AppendDataBoundItems="true" required > - Tutto quello che devo fare è aggiungere "richiesto" alla fine e jquery-validation.js sa che lo voglio richiesto. È lo stesso per quasi tutti i diversi input. So che potrei usare l'attributo "richiesto" di ASP, ma sto usando altre cose su misura per me.
Ecco un link per maggiori informazioni: link

score 0 · Answer 2

In realtà, penso che ridurrà la complessità.

Il punto non è di sostituire un tag div per qualche altro tag casuale. Nel tuo esempio, in realtà non aiuta nulla. Questo perché hai lasciato la maggior parte dei tag nel tuo esempio vuoto. In realtà sarebbero pieni di markup, più come:

<div class='container'>
   <div class='header'>
       <div class='logo'/>
       <div class='menu'>
           <div class='menuitem'>
              ...
           </div>
        </div>
   </div>
   <div class='mainbody'>
       <div class='someusercontrol'>
            <label>All the money</label>
            <input type="checkbox">
            <input type="text"/>
            <img res="data:..."/>
       </div>
   </div>
   </div class='footer'>
       <div class="copyright">Lorem Ipsum...</div>
       <a href="terms">Terms</a>
   </div>
</div>

Ci sono alcuni problemi con questo:

Tutto quel markup rende difficile avere un'idea di cosa sta succedendo.
Non riesco a riutilizzare facilmente la stessa marcatura in più posti / pagine.

Un modo per risolverlo è usare un linguaggio modello, così puoi scrivere qualcosa come:

<div class='container'>
    {{include:header.html}}
    <div class="mainbody">
         {{include:someusercontrol label="All the money"}}
    </div>
    {{include:footer.html}}
</div>

Ma questo ha due problemi:

Abbiamo un mix di sintassi tra il modello e l'html.
È facile includere il markup per qualcosa senza includere il css o js appropriato.

I componenti risolvono entrambi questi aspetti. Estendono la sintassi html, in modo che il codice per includere un modello assomigli ad un tag html e che includa anche il modello includa automaticamente l'approriate js e css.

Fondamentalmente, a meno che tu non sia disposto a duplicare il markup dappertutto, hai bisogno di qualcosa di più o meno equivalente a questi componenti. I componenti sono un modo pulito e pulito di farlo.