{"id":32825,"date":"2021-05-11T10:00:00","date_gmt":"2021-05-11T08:00:00","guid":{"rendered":"https:\/\/blexin.com\/?p=32825"},"modified":"2021-05-12T11:26:25","modified_gmt":"2021-05-12T09:26:25","slug":"blazor-vs-angular-quale-scegliere-seconda-parte","status":"publish","type":"post","link":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/","title":{"rendered":"Blazor vs Angular: quale scegliere? Seconda parte"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

Dopo aver confrontato i due framework dal punto di vista dell\u2019esperienza di sviluppo, analizziamo adesso le funzionalit\u00e0 che entrambi mettono a disposizione in termini di componenti, infrastruttura e maturit\u00e0. <\/p>\n\n\n\n

Mentre Angular \u00e8 basato su ECMAScript e su un insieme di librerie appositamente create per dare vita al framework, Blazor poggia sul .NET Core framework, ereditandone tutte le funzionalit\u00e0 e peculiarit\u00e0. A differenza del .NET Framework classico, .NET Core fornisce nativamente Dependency Injection, Logging e supporto alla configurazione, funzionalit\u00e0 che Blazor eredit\u00e0 direttamente, cos\u00ec come tanti aspetti avanzati come la Reflection, LINQ e tutto quello che conosciamo del mondo .NET. Uniti alla forte tipizzazione di C#, questi aspetti possono fare la differenza in tanti scenari business, a patto ovviamente di conoscerli. <\/p>\n\n\n\n

Dependency Injection<\/strong> <\/em><\/h2>\n\n\n\n

Uno dei metodi pi\u00f9 diffusi per implementare il principio dell\u2019inversione di controllo<\/a> (IoC), \u00e8 utilizzare una Factory astratta<\/a> che fornisca le dipendenze alle classi che ne hanno bisogno. In programmazione si usa per rendere gli elementi della propria soluzione bassamente accoppiati, in modo da rendere sostituibili le implementazioni delle dipendenze. Oltre ad essere una pratica molto utile per avere codice di alta qualit\u00e0, manutenibile e testabile, \u00e8 anche un modo molto interessante per sostituire, anche a caldo, implementazioni di una funzionalit\u00e0 sulla base delle proprie esigenze. Questa tecnica \u00e8 chiamata Dependency Injection<\/a> ed \u00e8 implementata nativamente dai moderni framework di sviluppo software. <\/p>\n\n\n\n

Tipicamente, una dipendenza \u00e8 un\u2019 istanza di una classe che serve al nostro componente per eseguire delle operazioni, ad esempio invocare il back-end per recuperare delle informazioni, oppure una classe di servizio che esegue dei calcoli. <\/p>\n\n\n\n

Un fatto interessante delle librerie di dependency injection, \u00e8 che ci permettono sia di definire le dipendenze, sia il loro ciclo di vita, risolvendo a catena tutte le dipendenze di cui avete bisogno. Questo significa che se abbiamo un componente che ha bisogno di una classe per fare qualche operazione, invece di istanziare direttamente la classe, chiede alla Factory di fornirgliela: sar\u00e0 quindi la Factory a decidere, sulla base della sua configurazione, se istanziare una nuova classe o restituire una istanza gi\u00e0 creata precedentemente. <\/p>\n\n\n\n

Tipicamente, una gestione del ciclo di vita che crea sempre una nuova istanza ad ogni richiesta, viene detta Transiente. Se viene create invece una istanza sulla base di un certo contesto, ad esempio se viene creata una istanza una sola volta nell\u2019arco di una stessa richiesta HTTP e restituisco sempre la stessa a chiunque la richieda nell\u2019arco di quella richiesta, il ciclo di vita viene chiamate Scoped, dove lo scope, in questo caso, \u00e8 la richiesta HTTP. Se invece viene creata una istanza una sola volta e restituita sempre la stessa, si parla di Singleton. <\/p>\n\n\n\n

Teniamo presente che se la classe che deve essere istanziata ha, a sua volta, delle dipendenze, la Factory risolve anche quelle, creando un vero e proprio albero di oggetti che accoppiano dinamicamente le parti dell’applicazione. <\/p>\n\n\n\n

Se vi state chiedendo perch\u00e9 dovreste fare una cosa del genere invece di implementare tutto nei metodi del componente stesso, vi suggerisco di partire per il lungo viaggio nell\u2019ingegneria del software<\/a>. Ma vi faccio notare che, a parte tutti i benefici in termini di qualit\u00e0, la possibilit\u00e0 di configurare il ciclo di vita di un oggetto ha il piacevole effetto collaterale di poter creare degli oggetti da condividere tra pi\u00f9 componenti, fornendo un meccanismo di comunicazione tra elementi della vostra UI che non si trovano in relazione padre\/figlio.  <\/p>\n\n\n\n

Sia Angular che Blazor forniscono strumenti per la dependency injection, nonostante siano molto diversi tra loro. Angular<\/a> implementa un meccanismo gerarchico, basato su provider, in cui \u00e8 possibile definire chi fornisce le dipendenza a chi. Possiamo ad esempio indicare che un modulo \u00e8 il provider di specifiche dipendenze: questo significa che tutti i componenti di quel modulo possono ricevere la stessa istanza della classe desiderata. In alternativa, posso definire un nuovo provider a livello di componente: in questo caso il componente crea l\u2019istanza per se e i suoi figli (i componenti contenuti all\u2019interno di esso). Le classi iniettate in Angular vengono dette Service, e sono identificate dall\u2019annotazione @Injectable. In realt\u00e0 questa annotazione \u00e8 necessaria solo se la classe definisce a sua volta delle dipendenze.<\/p>\n\n\n\n

Blazor<\/a>, essendo basato su .NET Core, non ha bisogno di implementare una libreria per la dependency injection, dato che il framework la fornisce gi\u00e0 nativamente. Quindi possiamo utilizzare tutto quello che gi\u00e0 sappiamo del motore di dependency injection di .NET, compresa la possibilit\u00e0 di sostituirlo con un motore custom di nostra preferenza.  <\/p>\n\n\n\n

Facciamo giusto una piccola precisazione per la gestione del ciclo di vita degli oggetti in Blazor Server e Blazor WebAssembly. In Blazor Server l\u2019applicazione \u00e8, a tutti gli effetti, una applicazione ASP.NET Core, quindi il concetto di Singleton, Transient e Scoped resta invariato. In una applicazione Blazor WebAssembly, il codice gira nel browser, quindi Scoped e Singleton tendono a confondersi, dato che, finch\u00e9 non aggiornate la pagina, gli oggetti Scoped hanno la stessa durata degli oggetti Singleton. <\/p>\n\n\n\n

CSS Isolation<\/strong><\/h2>\n\n\n\n

Anche la CSS isolation \u00e8 presente in entrambi i framework: abbiamo cio\u00e8 la possibilit\u00e0 di scrivere regole CSS che si applicano a un particolare componente, quindi il resto dell\u2019applicazione non ne sar\u00e0 impattata. Ad esempio, possiamo decidere che nel nostro componente i titoli siano rossi, senza per questo far diventare rossi i titoli degli altri componenti dell\u2019applicazione.<\/p>\n\n\n\n

Nel caso di Angular<\/a> potete avere un array di file CSS, SAAS o LESS associati al vostro componete, dichiarando la lista nelle definizione del componente stesso (propriet\u00e0 styleUrls dell\u2019annotazione Component).  <\/p>\n\n\n\n

Nel caso di Blazor<\/a>,<\/a> invece, si lavora ancora una volta di convenzione, denominando il file <NomeComponente>.razor.css. Questo significa anche che al momento potete avere un unico file e deve necessariamente essere un CSS. Ovviamente potremmo intervenire in fase di build per generare questo file da un file SAAS o LESS, e potremmo a quel punto avere pi\u00f9 file, ma il framework e i suoi tool non ci supportano direttamente, almeno per il momento. <\/p>\n\n\n\n

Piccola nota personale: usate la CSS Isolation solo se ne avete strettamente bisogno o state realizzando componenti da ridistribuire in una libreria. In una applicazione reale mi sento di consigliare l\u2019uso di regole di CSS comuni, basandosi magari su un framework come Bootstrap. La parte di stilizzazione \u00e8 spesso complessa, e parzializzare le regole ostacola sia la manutenibilit\u00e0 che l\u2019ingresso nel team di una figura che si occupa solo della stilizzazione.<\/p>\n\n\n\n

Gestione delle Form<\/strong> <\/em><\/h2>\n\n\n\n

In Angular avete a disposizione ben due librerie diverse per la gestione delle form. La prima, presente fin dalla prima versione, \u00e8 chiamata Form Template<\/a>, e vi fornisce tutta una serie di direttive per risolvere la creazione e la gestione di form sulla parte di markup del vostro componente. E\u2019 la stessa libreria che vi consente di definire i famosi binding bidirezionali tra un vostro oggetto e la form stessa, che rende semplice, negli scenari pi\u00f9 comuni, la gestione della cattura dell\u2019input dell\u2019utente e la sua validazione, per la quale potete usare i validatori di HTML5 o crearne di personalizzati.<\/p>\n\n\n\n

A questa libreria \u00e8 stata poi aggiunta la possibilit\u00e0 di creare form reattive, da cui prende il nome, Reactive Forms<\/a>, in cui non avete pi\u00f9 i binding bidirezionali (le performance sentitamente ringraziano), ma la possibilit\u00e0 di sfruttare l\u2019approccio reattivo per tenere traccia dello stato della form e intervenire a ogni cambiamento. In questo caso la definizione della form avviene tutta lato codice, fornendo delle direttive per \u201cagganciare\u201d la form creata sugli elementi di markup. <\/p>\n\n\n\n

In Blazor abbiamo invece una serie di componenti ed eventi gi\u00e0 pronti per la creazione di form. Una form viene delimitata dal componente <EditForm><\/EditForm>, e al suo interno possiamo inserire i principali elementi di UI gi\u00e0 forniti o creati appositamente. Abbiamo la classica casella di testo (InputText), casella numerica (InputNumber), date picker (InputDate), e similari. Tutti questi componenti vi permettono il binding bidirezionale con un oggetto utilizzando l\u2019attributo @bind-Value, dopo avere specificato l\u2019istanza dell\u2019oggetto con la propriet\u00e0 Model dell\u2019EditForm. Utilizzando il componente <DataAnnotationValidator \/> potete aggiungere il supporto per la validazione sulla base delle Data Annotation della classe da cui \u00e8 stato creato l\u2019oggetto che conterr\u00e0 i vostri dati.  <\/p>\n\n\n\n

Potete trovare maggiori informazioni qui<\/a>, ma notiamo subito che questa \u00e8 una delle killer feature di Blazor per chi ha un back-end .NET: potete infatti condividere queste classi, decorate con le data annotation, tra back-end e front-end in una libreria condivisa e centralizzare cos\u00ec non solo la definizione di questi oggetti, ma sfruttare le Form Blazor per la validazione front-end, e il Model Binder di ASP.NET per ripetere le validazioni anche lato back-end, operazione che dovreste in ogni caso fare.<\/p>\n\n\n\n

Blazor, come Angular, nasce principalmente per gestire applicazioni Business, quindi in realt\u00e0 c\u2019\u00e8 tanto altro dietro le quinte, tra cui creare componenti Form personalizzati, intervenire nel processo di binding e validazione utilizzando EditContext invece di specificare semplicemente il Model, fino alla generazione dinamica della UI sfruttando la Reflection e le Expression di LINQ. Se vi va di dare un occhio, ho tenuto una sessione al WebDay organizzato da UgiDotNet sull\u2019argomento: Generazione dinamica della UI con Blazor WebAssembly<\/a>. <\/p>\n\n\n\n

Integrazione con il Back-end<\/strong> <\/em><\/h2>\n\n\n\n

Angular fornisce una libreria specifica anche per l\u2019integrazione con il back-end, grazie alla quale potete iniettare nei vostri service un HttpClient che vi permette di invocare API HTTP in maniera molto semplice. La libreria fornisce anche la possibilit\u00e0 di infilarsi nel processo di invocazione per fare qualcosa prima e\/o dopo una chiamata, come ad esempio loggare o aggiungere degli header sulla richiesta (il classico token JWT ad esempio), definendo quelli che il framework chiama HTTP Interceptor. Maggiori info qui<\/a>.<\/p>\n\n\n\n

In Blazor potete utilizzare il client HTTP di .NET Core, comprensivo del suo motore di serializzazione\/deserializzazione JSON e di tutto quello che sapete su questa libreria, che sicuramente avrete gi\u00e0 usato in altri scenari. Per Blazor vengono forniti anche alcuni Extension Methods per semplificare l\u2019invocazione di API REST, maggiori info qui<\/a>.<\/p>\n\n\n\n

Anche in Blazor potete inserirvi nella pipeline di invocazione HTTP, definendo in fase di configurazione del client HTTP dei message handler usando il metodo di estensione AddMessageHandler() della libreria Microsoft.Extensions.DependencyInjection. Anche in questo caso non si tratta di una libreria specifica di Blazor, ma del client HTTP. Potete approfondire qui<\/a>. <\/p>\n\n\n\n

Inoltre, sfruttando la libreria gRPC-Web<\/a>, potete utilizzare gRPC per invocare il back-end con entrambi i framework. <\/p>\n\n\n\n

JS Interop e JS Isolation<\/strong><\/h2>\n\n\n\n

Come sapete, il codice Typescript con cui scriviamo le applicazioni Angular viene convertito in JavaScript prima dell\u2019esecuzione. Nel caso di Blazor WebAssembly invece, il codice C# viene convertito in codice IL, jittato<\/em> in WebAssembly dal runtime Mono, quindi nessuna interazione con JS. <\/p>\n\n\n\n

Ma dato che\u00a0WebAssembly\u00a0e JavaScript vengono eseguiti\u00a0entrambi nel JavaScript Runtime, \u00e8 possibile da .NET invocare una funzione JavaScript<\/a>\u00a0\u00a0\u00a0e da JavaScript invocare un metodo\u00a0.NET<\/a>\u00a0statico o di istanza.\u00a0<\/p>\n\n\n\n

Prima della versione 5 di .NET l\u2019organizzazione del codice JavaScript a supporto delle applicazioni Blazor era basato sull\u2019inclusione di uno o pi\u00f9 file JS nella index.html, agganciando all\u2019oggetto window le funzioni da invocare. Oltre ad essere scomodo per scenari medio\/grandi, questo approccio non permette la parzializzazione del codice JavaScript sulla base delle esigenze, rendendolo il pi\u00f9 delle volte poco manutenibile e richiedendo il suo intero download all\u2019avvio. <\/p>\n\n\n\n

Con .NET 5 \u00e8 stata introdotta la JS Isolation, cio\u00e8 la possibilit\u00e0 di associare dei file JS a specifici componenti, che ne impongono il download quando attivati, modularizzando la loro scrittura. Questa funzionalit\u00e0 in realt\u00e0 \u00e8 stata introdotta per fornire supporto ai moduli ECMAScript<\/a> in Blazor, dato che i browser supportano questo standard di default. Vi lascio un articolo di approfondimento per la sintassi e le modalit\u00e0 d\u2019uso: https:\/\/khalidabuhakmeh.com\/blazor-javascript-isolation-modules-and-dynamic-csharp<\/a>. <\/p>\n\n\n\n

Lazy Load<\/strong> <\/h2>\n\n\n\n

In applicazioni molto grandi pu\u00f2 essere un grande vantaggio parzializzare il download del nostro codice in base a strategie diverse dal singolo download iniziale. Questa funzionalit\u00e0 \u00e8 chiamata Lazy Load e viene fornita sia da Angular che da Blazor (a partire da .NET 5). <\/p>\n\n\n\n

Il supporto di\u00a0Angular\u00a0per il\u00a0Lazy\u00a0Load \u00e8 completo: potete tirare gi\u00f9 interi moduli on-demand configurando il router<\/a>. In questo modo solo quando farete un primo accesso alla rotta configurata, il codice sar\u00e0 scaricato ed eseguito.\u00a0Potete\u00a0quindi\u00a0prevenire il download\u00a0di interi moduli\u00a0se l\u2019utente non ha accesso a quella rotta o\u00a0finch\u00e9\u00a0non vi accede.\u00a0Con l\u2019introduzione di Ivy, potete anche fare\u00a0Lazy\u00a0Load\u00a0di singoli componenti, invece che dell\u2019intero modulo, come ha chiaramente illustrato Salvatore nel suo articolo su\u00a0Angular\u00a09<\/a>.<\/p>\n\n\n\n

In Blazor al momento il supporto al Lazy Load \u00e8 piuttosto limitato, e richiede la suddivisione del codice che si vuole parzializzare in diverse DLL, andando a specificare a livello di progetto che si vuole rendere il download di quelle DLL Lazy<\/a>. Ci viene fornito un oggetto LazyAssemblyLoader, che possiamo iniettare dove ci serve, per attivare la funzionalit\u00e0. <\/p>\n\n\n\n

Nonostante sia un primo approccio funzionante, il Lazy Load fornito in Blazor \u00e8 ancora acerbo e non permette degli automatismi che sgravino il programmatore dalla gestione del download sulla base del routing, che si spera arrivi, insieme alla compilazione AOT, con .NET 6. <\/p>\n\n\n\n

Programmazione reattiva<\/strong><\/h2>\n\n\n\n

Un discorso a parte merita la programmazione reattiva, che pervade tutto il framework Angular grazie a RxJS<\/a>.<\/p>\n\n\n\n

Questa libreria introduce la possibilit\u00e0 di gestire stream di dati nel tempo, utilizzando il pattern Observer<\/a>: grazie alla possibilit\u00e0 di lavorare con degli oggetti Observable, possiamo utilizzare tutta una serie di operatori e crearne di personalizzati, per reagire quando qualcosa succede nella nostra applicazione. <\/p>\n\n\n\n

Nonostante tutta questa potenza di fuoco, questa \u00e8 proprio la parte meno conosciuta e sfruttata dai programmatori Angular. Inoltre, volendo, esiste la controparte Rx.NET<\/a> per portare gli Observable e i suoi operatori anche in Blazor, anche se, il pi\u00f9 delle volte, non se ne sente la necessit\u00e0 a causa dei delegate e degli eventi forniti nativamente da .NET. <\/p>\n\n\n\n

State Management<\/strong><\/h2>\n\n\n\n

Discorso diverso invece, sono le applicazioni per le quali pu\u00f2 essere un valore aggiunto l\u2019utilizzo di una libreria di State Management. In un approccio completamente reattivo, possiamo immaginare di avere localmente (nel browser intendo) uno store centralizzato che rappresenta lo stato dell\u2019applicazione a cui \u00e8 possibile sottoscriversi per essere notificati dei cambiamenti. Questo store pu\u00f2 essere modificato solo seguendo una serie di funzioni pure (per evitare side effects) che trattano strutture dati immutabili. <\/p>\n\n\n\n

Mi dispiace banalizzare il concetto perch\u00e9 \u00e8 molto interessante, magari ne parleremo in un altro articolo, ma a mio parere ha senso per applicazioni molto grandi che hanno una logica locale complessa, perch\u00e9 rende la manutenibilit\u00e0 dell\u2019applicazione pi\u00f9 sostenibile, a fronte di un debito tecnico pi\u00f9 alto.<\/p>\n\n\n\n

In Angular esistono librerie ormai diventate standard de facto per gestire un approccio del genere, come NgRx, che ha una maturit\u00e0 e diffusione tale da poterci basare le proprie soluzioni abbastanza a cuor leggero. <\/p>\n\n\n\n

Resta comunque la possibilit\u00e0 di gestire lo stato applicativo anche in applicazioni semplici, semplicemente andando a mantenere in memoria dei service o sfruttando l\u2019accesso agli storage del browser. Vi lascio un link alla documentazione ufficiale<\/a> per farvi un\u2019idea. <\/p>\n\n\n\n

Conclusioni<\/strong><\/h2>\n\n\n\n

Possiamo concludere che, nonostante la differenza di anzianit\u00e0, i due framework si equivalgono nella maggior pare degli scenari business medio\/piccoli in cui vengono utilizzati. Negli scenari medio\/grandi invece Angular, grazie al supporto di RxJS che potenzia drasticamente tutte le sue librerie e un Lazy Load pi\u00f9 completo, si posiziona sicuramente meglio. <\/p>\n\n\n\n

Ma se il grosso delle logiche da implementare sono CRUD e il back-end \u00e8 scritto in .NET, la possibilit\u00e0 di condividere librerie tra back-end e front-end, su cui centralizzare regole di validazione e di generazione dinamica della UI, grazie a attributi standard e custom, fa pendere inevitabilmente la bilancia verso Blazor.<\/p>\n\n\n\n

Comunque, c\u2019\u00e8 ancora da valutare un aspetto importantissimo, le performance, in tutte le sue sfaccettature, quindi restate sintonizzati per la terza e ultima parte di questo confronto all\u2019ultimo bit. <\/p>\n\n\n\n

Happy Coding<\/p>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"

Dall\u2019analisi al confronto: le funzionalit\u00e0 <\/p>\n","protected":false},"author":196716248,"featured_media":32836,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"off","_et_pb_old_content":"","_et_gb_content_width":"","_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_crdt_document":"","inline_featured_image":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_wpas_customize_per_network":false,"jetpack_post_was_ever_published":false},"categories":[688637374],"tags":[688637387,688637459],"class_list":["post-32825","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-angular","tag-blazor"],"yoast_head":"\nBlazor vs Angular: quale scegliere? Seconda parte - Blexin<\/title>\n<meta name=\"description\" content=\"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Blazor vs Angular: quale scegliere? Seconda parte - Blexin\" \/>\n<meta property=\"og:description\" content=\"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/\" \/>\n<meta property=\"og:site_name\" content=\"Blexin\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-11T08:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-05-12T09:26:25+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"1105\" \/>\n\t<meta property=\"og:image:height\" content=\"656\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Michele Aponte\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"Michele Aponte\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/\"},\"author\":{\"name\":\"Michele Aponte\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\"},\"headline\":\"Blazor vs Angular: quale scegliere? Seconda parte\",\"datePublished\":\"2021-05-11T08:00:00+00:00\",\"dateModified\":\"2021-05-12T09:26:25+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/\"},\"wordCount\":3074,\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1\",\"keywords\":[\"Angular\",\"Blazor\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"it-IT\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/\",\"name\":\"Blazor vs Angular: quale scegliere? Seconda parte - Blexin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1\",\"datePublished\":\"2021-05-11T08:00:00+00:00\",\"dateModified\":\"2021-05-12T09:26:25+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\"},\"description\":\"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1\",\"width\":1105,\"height\":656},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/blazor-vs-angular-quale-scegliere-seconda-parte\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/blexin.com\\\/it\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blazor vs Angular: quale scegliere? Seconda parte\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/\",\"name\":\"Blexin\",\"description\":\"Con noi \u00e8 semplice\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/blexin.com\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\",\"name\":\"Michele Aponte\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"caption\":\"Michele Aponte\"},\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/author\\\/michele-aponteblexin-com\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Blazor vs Angular: quale scegliere? Seconda parte - Blexin","description":"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/","og_locale":"it_IT","og_type":"article","og_title":"Blazor vs Angular: quale scegliere? Seconda parte - Blexin","og_description":"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati","og_url":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/","og_site_name":"Blexin","article_published_time":"2021-05-11T08:00:00+00:00","article_modified_time":"2021-05-12T09:26:25+00:00","og_image":[{"width":1105,"height":656,"url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","type":"image\/png"}],"author":"Michele Aponte","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"Michele Aponte","Tempo di lettura stimato":"10 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#article","isPartOf":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/"},"author":{"name":"Michele Aponte","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005"},"headline":"Blazor vs Angular: quale scegliere? Seconda parte","datePublished":"2021-05-11T08:00:00+00:00","dateModified":"2021-05-12T09:26:25+00:00","mainEntityOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/"},"wordCount":3074,"image":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","keywords":["Angular","Blazor"],"articleSection":["Blog"],"inLanguage":"it-IT"},{"@type":"WebPage","@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/","url":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/","name":"Blazor vs Angular: quale scegliere? Seconda parte - Blexin","isPartOf":{"@id":"https:\/\/blexin.com\/it\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#primaryimage"},"image":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","datePublished":"2021-05-11T08:00:00+00:00","dateModified":"2021-05-12T09:26:25+00:00","author":{"@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005"},"description":"Nella seconda parte del confronto fra Angular e Blazor, Michele analizza le funzionalit\u00e0 dei framework per frontend pi\u00f9 utilizzati","breadcrumb":{"@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#primaryimage","url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","contentUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","width":1105,"height":656},{"@type":"BreadcrumbList","@id":"https:\/\/blexin.com\/it\/blog\/blazor-vs-angular-quale-scegliere-seconda-parte\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blexin.com\/it\/"},{"@type":"ListItem","position":2,"name":"Blazor vs Angular: quale scegliere? Seconda parte"}]},{"@type":"WebSite","@id":"https:\/\/blexin.com\/it\/#website","url":"https:\/\/blexin.com\/it\/","name":"Blexin","description":"Con noi \u00e8 semplice","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blexin.com\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Person","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005","name":"Michele Aponte","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","caption":"Michele Aponte"},"url":"https:\/\/blexin.com\/it\/author\/michele-aponteblexin-com\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2021\/05\/ITA-angularvsblazor2.png?fit=1105%2C656&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pcyUBx-8xr","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/32825","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/users\/196716248"}],"replies":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/comments?post=32825"}],"version-history":[{"count":32,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/32825\/revisions"}],"predecessor-version":[{"id":32886,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/32825\/revisions\/32886"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media\/32836"}],"wp:attachment":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media?parent=32825"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/categories?post=32825"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/tags?post=32825"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}