{"id":29236,"date":"2024-10-16T05:00:00","date_gmt":"2024-10-16T03:00:00","guid":{"rendered":"https:\/\/sii.pl\/blog\/?p=29236"},"modified":"2024-10-14T11:12:32","modified_gmt":"2024-10-14T09:12:32","slug":"adobe-edge-delivery-services-latwe-tworzenie-szybkich-stron","status":"publish","type":"post","link":"https:\/\/sii.pl\/blog\/adobe-edge-delivery-services-latwe-tworzenie-szybkich-stron\/","title":{"rendered":"Adobe Edge Delivery Services \u2013 \u0142atwe tworzenie szybkich stron"},"content":{"rendered":"\n<p>Adobe Edge Delivery Services to dodatkowy zestaw us\u0142ug, kt\u00f3ry mo\u017cna u\u017cy\u0107 w wersji chmurowej Adobe Experience Manager (AEM), aby rozszerzy\u0107 jego funkcjonalno\u015bci. Edge Delivery wykorzystuje zalety infrastruktury Adobe oraz elastyczno\u015b\u0107 AEM, umo\u017cliwiaj\u0105c autorom \u0142atwe tworzenie stron docelowych, jednocze\u015bnie zapewniaj\u0105c u\u017cytkownikom ko\u0144cowym ich efektywne i szybkie wy\u015bwietlanie.<\/p>\n\n\n\n<p>Z artyku\u0142u dowiecie si\u0119, jak \u0142atwo stworzy\u0107 szybkie strony z wykorzystaniem Adobe Edge Delivery Services.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Tworzenie bardzo szybkich stron docelowych<\/strong><\/h2>\n\n\n\n<p>Celem Edge Delivery jest stworzenie stron zoptymalizowanych pod k\u0105tem szybko\u015bci \u0142adowania, co ma kluczowe znaczenie dla osi\u0105gania wysokich pozycji w wynikach wyszukiwania. Szybko\u015b\u0107 \u0142adowania stron to istotny czynnik zar\u00f3wno dla algorytm\u00f3w wyszukiwarek, jak i dla pozytywnych do\u015bwiadcze\u0144 u\u017cytkownik\u00f3w. Wiele witryn. korporacyjnych cierpi na op\u00f3\u017anienia wynikaj\u0105ce z nadmiernego obci\u0105\u017cenia bibliotekami i innymi zasobami, co negatywnie wp\u0142ywa na ich pozycjonowanie i odbi\u00f3r przez odwiedzaj\u0105cych. <\/p>\n\n\n\n<p>Adobe, korzystaj\u0105c z zaawansowanej infrastruktury sieciowej, kt\u00f3r\u0105 dysponuje, wdro\u017cy\u0142o Edge Delivery, aby rozwi\u0105za\u0107 te problemy i zapewni\u0107 szybkie wy\u015bwietlanie. Dzi\u0119ki temu korporacyjne strony mog\u0105 by\u0107 nawet szybsze ni\u017c l\u017cejsze serwisy budowane w konkurencyjnych technologiach.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Przyspieszenie w Edge Delivery Services<\/strong><\/h2>\n\n\n\n<p>Co robi Edge Delivery Services, aby przy\u015bpieszy\u0107 wczytanie strony? Warto przybli\u017cy\u0107 kilka element\u00f3w:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Z za\u0142o\u017cenia tworzenie stron dla Edge Delivery zaczyna si\u0119 od strony, kt\u00f3ra ma bardzo wysoki wynik szybko\u015bci wskazywany przez takie narz\u0119dzia jak Google Lighthouse. Wynik ten utrzymuje si\u0119 przez ca\u0142y proces developmentu. Dzi\u0119ki temu unika si\u0119 sytuacji, w kt\u00f3rej strona staje si\u0119 wolna na ko\u0144cowym etapie prac i trzeba po\u015bwi\u0119ci\u0107 wiele zasob\u00f3w na prace optymalizacyjne. Takie podej\u015bcie pozwala na bardziej efektywne wykorzystanie zasob\u00f3w oraz gwarantuje wysoki poziom satysfakcji u\u017cytkownik\u00f3w ko\u0144cowych.<\/li>\n\n\n\n<li>Edge Delivery korzysta z globalnej sieci serwer\u00f3w brzegowych CDN, kt\u00f3re s\u0105 rozmieszczone w r\u00f3\u017cnych lokalizacjach geograficznych. Gdy u\u017cytkownik odwiedza stron\u0119 docelow\u0105, tre\u015bci s\u0105 dostarczane z najbli\u017cszego serwera brzegowego, co znacz\u0105co skraca czas przesy\u0142ania danych i redukuje op\u00f3\u017anienia.<\/li>\n\n\n\n<li><a href=\"https:\/\/experienceleague.adobe.com\/en\/docs\/experience-manager-65\/content\/assets\/dynamic\/http2\" target=\"_blank\" aria-label=\" (opens in a new tab)\" rel=\"noreferrer noopener\" class=\"ek-link\" rel=\"nofollow\" >Edge Delivery wspiera protok\u00f3\u0142 HTTP\/2<\/a>, kt\u00f3ry umo\u017cliwia r\u00f3wnoczesne przesy\u0142anie wielu zasob\u00f3w w ramach jednego po\u0142\u0105czenia, co wp\u0142ywa na kr\u00f3tszy czas \u0142adowania stron. HTTPS zapewnia bezpieczne po\u0142\u0105czenia oraz przy\u015bpiesza wy\u015bwietlanie strony internetowej.<\/li>\n\n\n\n<li>Strony tworzone zgodnie z najlepszymi praktykami dla Edge Delivery powinny wykorzystywa\u0107 jedynie czysty JavaScript i CSS, co pozwala ograniczy\u0107 liczb\u0119 zasob\u00f3w, kt\u00f3re przegl\u0105darka musi pobra\u0107 w celu wygenerowania tre\u015bci. Dzi\u0119ki temu proces \u0142adowania jest szybszy i bardziej efektywny.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Testujemy!<\/strong><\/h3>\n\n\n\n<p>Sprawdzi\u0142em deklaracje Adobe, czy s\u0105 zgodne z rzeczywisto\u015bci\u0105 i oto wynik:<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4.png\"><img decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4-1024x576.png\" alt=\"Wynik testu zgodno\u015bci deklaracji Adobe z rzeczywisto\u015bci\u0105\" class=\"wp-image-29239\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4-1024x576.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4-300x169.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4-768x432.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4-555x312.png 555w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image1-4.png 1152w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption class=\"wp-element-caption\">Ryc. 1 Wynik testu zgodno\u015bci deklaracji Adobe z rzeczywisto\u015bci\u0105<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Szybko\u015b\u0107 tworzenia tre\u015bci<\/strong><\/h2>\n\n\n\n<p>Edycja i zarz\u0105dzanie stronami zawsze by\u0142y kluczowe dla Adobe. Dzi\u0119ki temu AEM zyska\u0142 popularno\u015b\u0107 jako system do zarz\u0105dzania tre\u015bci\u0105 dla korporacji. R\u00f3wnie\u017c Edge Delivery pozwala na \u0142atwe edytowanie oraz tworzenie nowych stron, kt\u00f3re pozwalaj\u0105 firmom na szybkie tworzenie i aktualizowanie tre\u015bci w odpowiedzi na zmieniaj\u0105ce si\u0119 potrzeby, co zwi\u0119ksza ich elastyczno\u015b\u0107 i efektywno\u015b\u0107.<\/p>\n\n\n\n<p>Tworzenie nowych stron ogranicza si\u0119 jedynie do przygotowywania plik\u00f3w i folder\u00f3w w Google Drive. To eliminuje konieczno\u015b\u0107 posiadania wiedzy technicznej przez autora. Wystarczy, \u017ce zna narz\u0119dzia Google Drive oraz Google Docs, kt\u00f3re swoim wygl\u0105dem i funkcjonalno\u015bci\u0105 przypominaj\u0105 Microsoft Word, korzystaj\u0105c z Document Base Authoring \u2013 niewymagaj\u0105cym tradycyjnego backendu.<\/p>\n\n\n\n<p>Dzi\u0119ki takiemu podej\u015bciu proces tworzenia tre\u015bci jest prosty i intuicyjny. U\u017cywanie Google Drive do tworzenia stron umo\u017cliwia r\u00f3wnoleg\u0142\u0105 prac\u0119 autor\u00f3w oraz deweloper\u00f3w. Autor nie musi czeka\u0107, a\u017c element strony b\u0119dzie uko\u0144czony \u2013 mo\u017ce pracowa\u0107 od razu w Google Docs. W tym samym czasie front-end deweloperzy maj\u0105 mo\u017cliwo\u015b\u0107, by pracowa\u0107 na komponentami i ich wygl\u0105dem. Po zako\u0144czeniu dzia\u0142a\u0144 ca\u0142o\u015b\u0107 mo\u017ce zosta\u0107 od razu upubliczniona na stronie produkcyjnej.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2.png\"><img decoding=\"async\" width=\"1024\" height=\"362\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2-1024x362.png\" alt=\"Zrzut ekranu dla katalogu zawieraj\u0105cego tre\u015b\u0107 do strony\" class=\"wp-image-29241\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2-1024x362.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2-300x106.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2-768x271.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2-1536x542.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image2-2.png 1835w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption class=\"wp-element-caption\">Ryc. 2 Zrzut ekranu dla katalogu zawieraj\u0105cego tre\u015b\u0107 do strony<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Przyspieszenie strony z AEM<\/strong><\/h2>\n\n\n\n<p>Autor mo\u017ce doda\u0107 stron\u0119 za pomoc\u0105 Uniwersalnego Edytora na instancji autora w AEM, a nast\u0119pnie opublikowa\u0107 j\u0105. Z instancji publicznej strona mo\u017ce zosta\u0107 przekazana do Edge Delivery, co pozwala na optymalizacj\u0119 jej wydajno\u015bci.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image3-1.png\"><img decoding=\"async\" width=\"700\" height=\"435\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image3-1.png\" alt=\"Schematyczne przedstawienie sposob\u00f3w edytowania tre\u015bci dla Edge Delivery \" class=\"wp-image-29243\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image3-1.png 700w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/image3-1-300x186.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a><figcaption class=\"wp-element-caption\">Ryc. 3 <a href=\"https:\/\/experienceleague.adobe.com\/en\/docs\/experience-manager-cloud-service\/content\/edge-delivery\/overview\" target=\"_blank\" aria-label=\" (opens in a new tab)\" rel=\"noreferrer noopener\" class=\"ek-link\" rel=\"nofollow\" >Schematyczne przedstawienie sposob\u00f3w edytowania tre\u015bci dla Edge Delivery<\/a><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Moja opinia na temat Edge Delivery<\/strong><\/h2>\n\n\n\n<p>Koncept Edge Delivery jest szczeg\u00f3lnie interesuj\u0105cy z perspektywy front-end developer\u00f3w oraz content autor\u00f3w. Wymaga jednak przyzwyczajenia si\u0119 do podej\u015bcia serverless oraz braku lokalnego przechowywania danych. Kluczowe jest r\u00f3wnie\u017c zrozumienie, w jaki spos\u00f3b dane s\u0105 przetwarzane w ramach ekosystemu Adobe.<\/p>\n\n\n\n<p>Z drugiej strony, mo\u017cliwo\u015b\u0107 szybkiego uruchomienia aplikacji bez potrzeby tworzenia back-endu jest niezwykle atrakcyjna. Komponenty mog\u0105 by\u0107 budowane, style definiowane, a tre\u015bci wprowadzane bezpo\u015brednio w Google Docs. Do stworzenia pe\u0142nego landing page\u2019a wystarczy wsp\u00f3\u0142praca jednego front-end developera i autora tre\u015bci.<\/p>\n\n\n\n<p>Narz\u0119dzia do pracy z Edge Delivery s\u0105 intuicyjne. Projekt jest oparty na standardowym \u015brodowisku npm, kt\u00f3re wymaga podstawowej znajomo\u015bci, ale rozpocz\u0119cie pracy jest proste i bezproblemowe.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>\u0179r\u00f3d\u0142a<\/strong><\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li><a href=\"https:\/\/experienceleague.adobe.com\/en\/docs\/experience-manager-cloud-service\/content\/edge-delivery\/overview\" target=\"_blank\" aria-label=\" (opens in a new tab)\" rel=\"noreferrer noopener\" class=\"ek-link\" rel=\"nofollow\" >Edge Delivery Services Overview<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/experienceleague.adobe.com\/en\/docs\/events\/apac-commerce-recordings\/2024\/edge-delivery-services\" target=\"_blank\" aria-label=\" (opens in a new tab)\" rel=\"noreferrer noopener\" class=\"ek-link\" rel=\"nofollow\" >Lightning Speed: Adobe\u2019s Edge Delivery Service<\/a><\/li>\n<\/ol>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-left kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;left&quot;,&quot;id&quot;:&quot;29236&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;2&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;5&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;11&quot;,&quot;greet&quot;:&quot;&quot;,&quot;legend&quot;:&quot;5\\\/5 ( votes: 2)&quot;,&quot;size&quot;:&quot;18&quot;,&quot;title&quot;:&quot;Adobe Edge Delivery Services \u2013 \u0142atwe tworzenie szybkich stron&quot;,&quot;width&quot;:&quot;139.5&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} ( {votes}: {count})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 139.5px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 14.4px;\">\n            5\/5 ( votes: 2)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Adobe Edge Delivery Services to dodatkowy zestaw us\u0142ug, kt\u00f3ry mo\u017cna u\u017cy\u0107 w wersji chmurowej Adobe Experience Manager (AEM), aby rozszerzy\u0107 &hellip; <a class=\"continued-btn\" href=\"https:\/\/sii.pl\/blog\/adobe-edge-delivery-services-latwe-tworzenie-szybkich-stron\/\">Continued<\/a><\/p>\n","protected":false},"author":673,"featured_media":29245,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_editorskit_title_hidden":false,"_editorskit_reading_time":0,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","inline_featured_image":false,"footnotes":""},"categories":[1316],"tags":[2726,1546,930],"class_list":["post-29236","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development-na-miekko","tag-adobe-edge-delivery-services","tag-przeglad-narzedzi","tag-e-commerce"],"acf":[],"aioseo_notices":[],"republish_history":[],"featured_media_url":"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2024\/10\/Adobe-Edge-Delivery-Services-\u2013-latwe-tworzenie-szybkich-stron.jpg","category_names":["Development na mi\u0119kko"],"_links":{"self":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/29236"}],"collection":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/users\/673"}],"replies":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/comments?post=29236"}],"version-history":[{"count":1,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/29236\/revisions"}],"predecessor-version":[{"id":29247,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/29236\/revisions\/29247"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media\/29245"}],"wp:attachment":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media?parent=29236"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/categories?post=29236"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/tags?post=29236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}