{"id":50793,"date":"2020-01-13T07:00:20","date_gmt":"2020-01-13T06:00:20","guid":{"rendered":"http:\/\/smeupnew.it\/magazine\/blog\/libreria-di-web-components\/"},"modified":"2021-04-10T11:13:06","modified_gmt":"2021-04-10T09:13:06","slug":"libreria-di-web-components","status":"publish","type":"post","link":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/","title":{"rendered":"Come funziona la nuova matrice in Ketch.UP,  la libreria di web components"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container nonhundred-percent-fullwidth non-hundred-percent-height-scrolling gradient-container-1\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-flex-start fusion-flex-content-wrap\" style=\"max-width:1144px;margin-left: calc(-4% \/ 2 );margin-right: calc(-4% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion_builder_column_1_1 1_1 fusion-flex-column\" style=\"--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:1.92%;--awb-margin-bottom-large:0px;--awb-spacing-left-large:1.92%;--awb-width-medium:100%;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\"><div class=\"fusion-column-wrapper fusion-flex-justify-content-flex-start fusion-content-layout-column\"><div class=\"fusion-text fusion-text-1\"><p>La <strong>nuova matrice<\/strong> \u00e8 un componente grafico sviluppato per Ketch.UP, una l<strong>ibreria di Web Components<\/strong> che, nel tempo, diverranno la base front-end di Sme.UP ERP.<\/p>\n<p>I Web Components sono degli elementi personalizzati e riutilizzabili, sviluppati con una tecnologia standard e usati in applicazioni web.<\/p>\n<p>L\u2019 approccio utilizzato permette alla matrice di sfruttare tutti i vantaggi di una <strong>nuova tecnologia di sviluppo<\/strong> e di esaltare al meglio, grazie alle sue caratteristiche, i pregi di Ketch.UP.<\/p>\n<p>I componenti web sviluppati in Ketch.UP non si limitano a definire esclusivamente la grafica ma possiedono anche informazioni che amplificano il componente e che permettono <strong>interazioni pi\u00f9 specifich<\/strong>e tra l\u2019utente e il software che utilizza la libreria di Web Components.<br \/>\nUn esempio di utilizzo: prendendo in considerazione una matrice di clienti, nel momento in cui decidiamo di voler aggiungere una nuova colonna, troviamo delle proposte di colonne aggiuntive suggerite in base al contenuto della matrice stessa. In parole povere, il software, sfruttando le informazioni dei componenti Ketch.UP, \u00e8 a conoscenza del fatto che i dati che stiamo trattando sono relativi a dei clienti, per cui ci propone delle <strong>colonne inerenti<\/strong> al contenuto che potrebbero esserci utili nella gestione delle informazioni relative a un cliente, come l\u2019indirizzo, la ragione sociale e via discorrendo.<\/p>\n<\/div><div class=\"fusion-image-element \" style=\"--awb-caption-title-font-family:var(--h2_typography-font-family);--awb-caption-title-font-weight:var(--h2_typography-font-weight);--awb-caption-title-font-style:var(--h2_typography-font-style);--awb-caption-title-size:var(--h2_typography-font-size);--awb-caption-title-transform:var(--h2_typography-text-transform);--awb-caption-title-line-height:var(--h2_typography-line-height);--awb-caption-title-letter-spacing:var(--h2_typography-letter-spacing);\"><span class=\" fusion-imageframe imageframe-none imageframe-1 hover-type-none\"><img decoding=\"async\" width=\"1536\" height=\"713\" alt=\"smeup Nuova Matrice\" title=\"smeup Nuova Matrice\" src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice.png\" data-orig-src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice.png\" class=\"lazyload img-responsive wp-image-53953\" srcset=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271536%27%20height%3D%27713%27%20viewBox%3D%270%200%201536%20713%27%3E%3Crect%20width%3D%271536%27%20height%3D%27713%27%20fill-opacity%3D%220%22%2F%3E%3C%2Fsvg%3E\" data-srcset=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice-200x93.png 200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice-400x186.png 400w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice-600x279.png 600w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice-800x371.png 800w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice-1200x557.png 1200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/Nuova-Matrice.png 1536w\" data-sizes=\"auto\" data-orig-sizes=\"(max-width: 640px) 100vw, 1200px\" \/><\/span><\/div><div class=\"fusion-text fusion-text-2\"><p><em>Figura 1 &#8211; Esempi di Matrice nello Showcase Ketch.UP<\/em><\/p>\n<p>La nuova matrice, essendo un Web Component, offre diversi vantaggi:<\/p>\n<ul>\n<li><strong>Compatibilit\u00e0<\/strong>: Essendo basata su una tecnologia standard web, la matrice pu\u00f2 essere usata su qualsiasi applicazione web e da qualsiasi framework. Questo garantisce alla libreria Ketch.UP anche una durabilit\u00e0 superiore garantendo, teoricamente, la possibilit\u00e0 di utilizzo anche con framework web futuri. In sostanza, col passare degli anni, potremmo dover riscrivere il programma con framework pi\u00f9 moderni. La libreria standard Ketch.UP rimarr\u00e0 compatibile anche con i framework web nuovi.<\/li>\n<li><strong>Open Source<\/strong>: Essendo Ketch.UP una libreria di componenti standard e non essendo necessariamente legata a Sme.UP ERP, Il progetto \u00e8 open source; utilizzabile e ampliabile da chiunque.<\/li>\n<li><strong>Prestazionale<\/strong>: si ridisegna in modo molto pi\u00f9 rapido; aumenta la velocit\u00e0 degli ordinamenti delle colonne e dei raggruppamenti.<\/li>\n<\/ul>\n<p>Essendo le prestazioni molto importanti, soprattutto in un software gestionale, vale la pena sottolineare questo vantaggio con dei numeri.<\/p>\n<p>Sono stati effettuati dei test per stabilire la <strong>differenza di tempistiche di rendering<\/strong> tra la nuova matrice e la sua vecchia rappresentazione con tecnologia JSF.<br \/>\nI tempi sono stati calcolati utilizzando il tool integrato in Google Chrome.<br \/>\nLa scheda usata \u00e8 la seguente:<\/p>\n<p>F(EXD;*SCO;) 1(;;) 2(MB;SCP_SCH;WETEST_EXB) 4(;;PERTST) 5(;;) 6(;;) P() INPUT()<\/p>\n<p>I dati rappresentano un\u2019anagrafica enti con 165 campi e 10000 record per un totale di 1 milione e 650 mila celle.<\/p>\n<p>Come mostrato in Figura 2 il tempo di rendering durante il caricamento della matrice Ketch.UP \u00e8 pari a 2227ms, mentre con la vecchia tecnologia richiede 5138ms. La nuova matrice, solo nella fase di caricamento permette gi\u00e0 di <strong>abbassare il tempo di disegno del 22%.<\/strong><\/p>\n<\/div><div class=\"fusion-image-element \" style=\"--awb-caption-title-font-family:var(--h2_typography-font-family);--awb-caption-title-font-weight:var(--h2_typography-font-weight);--awb-caption-title-font-style:var(--h2_typography-font-style);--awb-caption-title-size:var(--h2_typography-font-size);--awb-caption-title-transform:var(--h2_typography-text-transform);--awb-caption-title-line-height:var(--h2_typography-line-height);--awb-caption-title-letter-spacing:var(--h2_typography-letter-spacing);\"><span class=\" fusion-imageframe imageframe-none imageframe-2 hover-type-none\"><img decoding=\"async\" width=\"1024\" height=\"313\" alt=\"smeup tempi di rendering\" title=\"smeup tempi di rendering\" src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering.png\" data-orig-src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering.png\" class=\"lazyload img-responsive wp-image-53957\" srcset=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271024%27%20height%3D%27313%27%20viewBox%3D%270%200%201024%20313%27%3E%3Crect%20width%3D%271024%27%20height%3D%27313%27%20fill-opacity%3D%220%22%2F%3E%3C%2Fsvg%3E\" data-srcset=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-200x61.png 200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-400x122.png 400w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-600x183.png 600w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-800x245.png 800w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering.png 1024w\" data-sizes=\"auto\" data-orig-sizes=\"(max-width: 640px) 100vw, 1024px\" \/><\/span><\/div><div class=\"fusion-text fusion-text-3\"><p><em>Figura 2 &#8211; Differenza dei Tempi di Rendering tra JSF e Ketch.UP<\/em><\/p>\n<p>Il miglioramento \u00e8 ancora pi\u00f9 marcato durante la fase di ridisegno del componente, che avviene, per esempio, quando vengono effettuati degli ordinamenti o dei raggruppamenti.<\/p>\n<p>La Figura 3 mostra come, il tempo di rendering, durante 1 solo raggruppamento, per la matrice JSF \u00e8 pari a circa 20 secondi (19833ms) mentre la matrice Ketch.UP impiega solo poco pi\u00f9 di un secondo (1260ms).<\/p>\n<\/div><div class=\"fusion-image-element \" style=\"--awb-caption-title-font-family:var(--h2_typography-font-family);--awb-caption-title-font-weight:var(--h2_typography-font-weight);--awb-caption-title-font-style:var(--h2_typography-font-style);--awb-caption-title-size:var(--h2_typography-font-size);--awb-caption-title-transform:var(--h2_typography-text-transform);--awb-caption-title-line-height:var(--h2_typography-line-height);--awb-caption-title-letter-spacing:var(--h2_typography-letter-spacing);\"><span class=\" fusion-imageframe imageframe-none imageframe-3 hover-type-none\"><img decoding=\"async\" width=\"1535\" height=\"483\" alt=\"smeup tempi di rendering raggruppamento\" title=\"smeup tempi di rendering raggruppamento\" src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento.png\" data-orig-src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento.png\" class=\"lazyload img-responsive wp-image-53955\" srcset=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271535%27%20height%3D%27483%27%20viewBox%3D%270%200%201535%20483%27%3E%3Crect%20width%3D%271535%27%20height%3D%27483%27%20fill-opacity%3D%220%22%2F%3E%3C%2Fsvg%3E\" data-srcset=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento-200x63.png 200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento-400x126.png 400w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento-600x189.png 600w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento-800x252.png 800w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento-1200x378.png 1200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/tempi-di-rendering-raggruppamento.png 1535w\" data-sizes=\"auto\" data-orig-sizes=\"(max-width: 640px) 100vw, 1200px\" \/><\/span><\/div><div class=\"fusion-text fusion-text-4\"><p><em>Figura 3 &#8211; Differenza dei Tempi di Rendering dopo un\u00a0<\/em><i>raggruppamento<\/i><\/p>\n<p>In questo caso, la matrice Ketch.UP, \u00e8 del <strong>93,6% pi\u00f9 efficiente<\/strong> rispetto a quella JSF.<\/p>\n<p>Inoltre, sfruttando la tecnologia alla base della libreria Ketch.UP, le operazioni di ridisegno avvengono direttamente all\u2019interno del componente, senza necessariamente interpellare il server. Questo significa un enorme <strong>risparmio di tempo<\/strong> durante l\u2019operazione totale di raggruppamento, come mostrato in Figura 4.<\/p>\n<\/div><div class=\"fusion-image-element \" style=\"--awb-caption-title-font-family:var(--h2_typography-font-family);--awb-caption-title-font-weight:var(--h2_typography-font-weight);--awb-caption-title-font-style:var(--h2_typography-font-style);--awb-caption-title-size:var(--h2_typography-font-size);--awb-caption-title-transform:var(--h2_typography-text-transform);--awb-caption-title-line-height:var(--h2_typography-line-height);--awb-caption-title-letter-spacing:var(--h2_typography-letter-spacing);\"><span class=\" fusion-imageframe imageframe-none imageframe-4 hover-type-none\"><img decoding=\"async\" width=\"1535\" height=\"473\" alt=\"smeup differenza di tempo\" title=\"smeup differenza di tempo\" src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo.png\" data-orig-src=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo.png\" class=\"lazyload img-responsive wp-image-53951\" srcset=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271535%27%20height%3D%27473%27%20viewBox%3D%270%200%201535%20473%27%3E%3Crect%20width%3D%271535%27%20height%3D%27473%27%20fill-opacity%3D%220%22%2F%3E%3C%2Fsvg%3E\" data-srcset=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo-200x62.png 200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo-400x123.png 400w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo-600x185.png 600w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo-800x247.png 800w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo-1200x370.png 1200w, https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/differenza-di-tempo.png 1535w\" data-sizes=\"auto\" data-orig-sizes=\"(max-width: 640px) 100vw, 1200px\" \/><\/span><\/div><div class=\"fusion-text fusion-text-5\"><p><em>Figura 4 &#8211; Differenza di tempo dopo un raggruppamento<\/em><\/p>\n<p>Il grafico mostra come il tempo totale dell\u2019operazione, utilizzando Ketch.UP, \u00e8 meno di 9 secondi (8819ms). Utilizzando la vecchia tecnologia, il tempo totale dell\u2019operazione, \u00e8 pi\u00f9 di 2 minuti (124952ms).<\/p>\n<p>Tutto questo indica un risparmio del 93% e significa che l\u2019utente deve attendere molto meno per ottenere il risultato, aumentando di molto l\u2019<strong>usabilit\u00e0 del programma<\/strong>.<\/p>\n<\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>La nuova matrice \u00e8 un componente grafico sviluppato per KetchUP, una libreria di Web Components. L\u2019 approccio utilizzato permette alla matrice di sfruttare tutti i vantaggi di una nuova tecnologia di sviluppo e di esaltare al meglio, grazie alle sue caratteristiche, i pregi di Ketch.UP.<\/p>\n","protected":false},"author":1,"featured_media":53949,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[7175],"tags":[5990,6565,3764,6566],"class_list":["post-50793","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux","tag-interfaccia-utente","tag-matrice","tag-sme-up-erp","tag-web-components"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Come funziona la nuova matrice in Ketch.UP, la libreria di web components<\/title>\n<meta name=\"description\" content=\"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Come funziona la nuova matrice in Ketch.UP, la libreria di web components\" \/>\n<meta property=\"og:description\" content=\"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/\" \/>\n<meta property=\"og:site_name\" content=\"Magazine\" \/>\n<meta property=\"article:published_time\" content=\"2020-01-13T06:00:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-04-10T09:13:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"1067\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"smeup\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"smeup\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/\"},\"author\":{\"name\":\"smeup\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/#\\\/schema\\\/person\\\/194a55d96e7e52223a84ff78468bf5c7\"},\"headline\":\"Come funziona la nuova matrice in Ketch.UP, la libreria di web components\",\"datePublished\":\"2020-01-13T06:00:20+00:00\",\"dateModified\":\"2021-04-10T09:13:06+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/\"},\"wordCount\":1704,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/wp-content\\\/uploads\\\/sites\\\/5\\\/2020\\\/01\\\/libreria-web-components.jpg\",\"keywords\":[\"interfaccia utente\",\"matrice\",\"Sme.UP ERP\",\"web components\"],\"articleSection\":[\"UX\"],\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/\",\"url\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/\",\"name\":\"Come funziona la nuova matrice in Ketch.UP, la libreria di web components\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/wp-content\\\/uploads\\\/sites\\\/5\\\/2020\\\/01\\\/libreria-web-components.jpg\",\"datePublished\":\"2020-01-13T06:00:20+00:00\",\"dateModified\":\"2021-04-10T09:13:06+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/#\\\/schema\\\/person\\\/194a55d96e7e52223a84ff78468bf5c7\"},\"description\":\"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/wp-content\\\/uploads\\\/sites\\\/5\\\/2020\\\/01\\\/libreria-web-components.jpg\",\"contentUrl\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/wp-content\\\/uploads\\\/sites\\\/5\\\/2020\\\/01\\\/libreria-web-components.jpg\",\"width\":1600,\"height\":1067,\"caption\":\"smeup libreria web components\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/libreria-di-web-components\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Come funziona la nuova matrice in Ketch.UP, la libreria di web components\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/#website\",\"url\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/\",\"name\":\"Magazine\",\"description\":\"smeup\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/#\\\/schema\\\/person\\\/194a55d96e7e52223a84ff78468bf5c7\",\"name\":\"smeup\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g\",\"caption\":\"smeup\"},\"sameAs\":[\"https:\\\/\\\/www.smeup.com\"],\"url\":\"https:\\\/\\\/www.smeup.com\\\/magazine\\\/blog\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Come funziona la nuova matrice in Ketch.UP, la libreria di web components","description":"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.","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:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/","og_locale":"it_IT","og_type":"article","og_title":"Come funziona la nuova matrice in Ketch.UP, la libreria di web components","og_description":"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.","og_url":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/","og_site_name":"Magazine","article_published_time":"2020-01-13T06:00:20+00:00","article_modified_time":"2021-04-10T09:13:06+00:00","og_image":[{"width":1600,"height":1067,"url":"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg","type":"image\/jpeg"}],"author":"smeup","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"smeup","Tempo di lettura stimato":"5 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#article","isPartOf":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/"},"author":{"name":"smeup","@id":"https:\/\/www.smeup.com\/magazine\/#\/schema\/person\/194a55d96e7e52223a84ff78468bf5c7"},"headline":"Come funziona la nuova matrice in Ketch.UP, la libreria di web components","datePublished":"2020-01-13T06:00:20+00:00","dateModified":"2021-04-10T09:13:06+00:00","mainEntityOfPage":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/"},"wordCount":1704,"commentCount":0,"image":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#primaryimage"},"thumbnailUrl":"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg","keywords":["interfaccia utente","matrice","Sme.UP ERP","web components"],"articleSection":["UX"],"inLanguage":"it-IT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/","url":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/","name":"Come funziona la nuova matrice in Ketch.UP, la libreria di web components","isPartOf":{"@id":"https:\/\/www.smeup.com\/magazine\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#primaryimage"},"image":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#primaryimage"},"thumbnailUrl":"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg","datePublished":"2020-01-13T06:00:20+00:00","dateModified":"2021-04-10T09:13:06+00:00","author":{"@id":"https:\/\/www.smeup.com\/magazine\/#\/schema\/person\/194a55d96e7e52223a84ff78468bf5c7"},"description":"La nuova matrice \u00e8 un componente grafico, una libreria di Web Components. L\u2019approccio utilizzato permette di esaltare al meglio i pregi di Ketch.UP.","breadcrumb":{"@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#primaryimage","url":"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg","contentUrl":"https:\/\/www.smeup.com\/magazine\/wp-content\/uploads\/sites\/5\/2020\/01\/libreria-web-components.jpg","width":1600,"height":1067,"caption":"smeup libreria web components"},{"@type":"BreadcrumbList","@id":"https:\/\/www.smeup.com\/magazine\/blog\/libreria-di-web-components\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.smeup.com\/magazine\/"},{"@type":"ListItem","position":2,"name":"Come funziona la nuova matrice in Ketch.UP, la libreria di web components"}]},{"@type":"WebSite","@id":"https:\/\/www.smeup.com\/magazine\/#website","url":"https:\/\/www.smeup.com\/magazine\/","name":"Magazine","description":"smeup","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.smeup.com\/magazine\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Person","@id":"https:\/\/www.smeup.com\/magazine\/#\/schema\/person\/194a55d96e7e52223a84ff78468bf5c7","name":"smeup","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a88cc3ad6c0af01768fe2ac47c88a321699d97ced53c173f66ceaa51400f43ca?s=96&d=mm&r=g","caption":"smeup"},"sameAs":["https:\/\/www.smeup.com"],"url":"https:\/\/www.smeup.com\/magazine\/blog\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/posts\/50793","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/comments?post=50793"}],"version-history":[{"count":2,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/posts\/50793\/revisions"}],"predecessor-version":[{"id":53959,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/posts\/50793\/revisions\/53959"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/media\/53949"}],"wp:attachment":[{"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/media?parent=50793"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/categories?post=50793"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.smeup.com\/magazine\/wp-json\/wp\/v2\/tags?post=50793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}