Как да превърнем своя WordPress сайт в PWA

от | сеп. 2, 2021 | Блог, Грижа за сайта, Тенденции

Прогресивните уеб приложения, Progressive Web App или PWA са открояваща се мода в последно време. Накратко – концепцията събира в себе си правилата как да превърнете уеб страницата си в удобно приложение, което лесно се отваря на мобилен телефон, а също така – може да се ползва дори връзката ви да прекъсне. Разказахме ви за тях неотдавна и в блога на ZETTAHOST.bg.

Дотук добре, концепцията със сигурност е смислена, но… можем ли да я въплътим и в нашата WordPress страница? Не само можем, ами определено си струва да го направим. Нито е сложно, нито е скъпо, а резултатът без съмнение си струва. Ето какво е необходимо.

 

WP + PWA = ВНЛ

Накратко: PWA е повече обща концепция, идея, отколкото някакво конкретно технологично решение или имплементация. Тя обаче изглежда достатъчно силна, за да трансформира начина, по който се създават уеб проектите. Да зададе новата мода в това направление.

Един от показателните проекти в това отношение е Twitter Lite – олекотена версия на Twitter, която идва с амбицията именно да предложи популярната, особено на Запад, социална мрежа, в доста по-„приятелски“ вид, ако потребителят я отвори на телефона си.

А същевременно има и нещо друго. Мнозина от създателите на самата платформа WordPress през последните години говорят все повече за нуждата от това всяка работеща страница, базирана на WP, да изпълнява изискванията за прогресивна уеб апликация. И за да бъдем по-конкретни: един от водещите проекти в тази посока се движи от Automattic. Създателите на не толкова обичания сред всички по-ентусиазирани и идеалистично настроени потребители на мрежата wordpress.org все пак, не бива да забравяме, са и сред първопроходците на истинския WordPress.

Е, още през 2017 г. те анонсират включването на пълна интеграция за PWA в платформите си. Тогава дори обявяват, че това ще е изискване за всяка страница по подразбиране, хората ще могат да го отказват само ако преценят.

 

От дума на Press

Проектът им още е далеч от тази си фаза, но едно е сигурно. PWA определено изглежда като един от хитовете на настоящето и едно от задължителните изисквания на бъдещето, затова си струва да се подготвим, преди преходът между двете фази да е приключил.

И така, както от Google формулират основната идея за Progressive Web App, апликацията трябва да бъде:

  • Надеждна – като никога не се бави и не показва добрия стар динозавър, дори и интернет връзката на потребителя да не е стабилна;
  • Бърза – да реагира своевременно на всяко действие на потребителя, без да го кара да чака;
  • Ангажираща – да дава същото усещане, като програма, която сте стартирали от операционната система на компютъра си.
  • Responsive – буквално на български го превеждаме „отзивчив“ и пак ще е вярно, но в случая се има предвид новото, технологично и непреводимо значение на думата – да може да се отваря еднакво добре на устройства с всякакъв размер на екрана. Макар и последно в списъка, това изискване днес е важно и базово, дори извън света на PWA.

 

Прогресивен по идея

Звучи доста съблазнително, нали? И като комбинираме в едно възможностите, които дава новото направление, с тези на WordPress, на чиито плещи се крепи 1/3 от днешния интернет, звучи като много вероятната възможност за следващия стандарт в живота онлайн. Тези две концепции направо си звучат и като да се допълват естествено, нали! Ако не сте се замисляли, дори акронимите им „вървят“ перфектно – WP и PWA.

Отклонихме се доста в аргументите, но беше важно да ви убедим, че начинанието си струва. И така, имате (или се каните да създадете) WordPress страница и търсите как да я превърнете в прогресивно приложение?

Да започнем с основните изисквания, за да имате шанс изобщо да започнете. Те, обективно погледнато, са доста скромни. Надали сайтът ви не ги покрива, освен ако не е създаден твърде отдавна. А именно:

  • Сайтът ви да използва SSL – адресът му да започва с http и важната добавка от „s“, което, разбира се, днес е задължително за всяка страница;
  • Версията на WordPress, която ползвате, да е по-висока от 3.5.0;
  • Версията ви на PHP да е поне 5.3.

 

Сам или с приятел?

Първият вариант, разбира се, е да опитате сами. Никой не е казал, че за да се изпълнят изискванията за прогресивно приложение, трябва непременно да се приложи конкретна комбинация от технологии. Свободата в това отношение е пълна, стига резултатът да покрива четирите основни точки, резюмирани по-горе.

Така че, ако сте напреднали в програмирането, разбира се, няма какво и кой да ви спре, за да опитате сами да преработите основата на своята страница така, че да покрие изискванията.

Истината е обаче, че става дума за доста трудно начинание. Дори ако започвате от създаването на апликация отначало с някой от популярните JavaScript фреймуърци, си струва немалко усилия проектът да се превърне в PWA. А в платформа, която е в доста голяма степен изградена и измислена така, че да приема основно дребни оптимизации, това наистина е много, много сериозно предизвикателство.

Така или иначе, който и от вариантите да изберете, бързо можете да разберете дали сте на прав път благодарение на приложението Lighthouse. То измерва всички показатели за скоростта на сайта ви, като отделно инженерите на Google ви дават точни статистики дали страницата ви покрива изискванията за Progressive Web App.

Приятел в нужда

И, разбира се, второто решение, което със сигурност е най-логично за огромна част от потребителите, е просто да добавим плъгин, който да свърши за нас важната задача.

Тук, отново по традиция, заговорим ли за WordPress, идват двете основни групи – платени, или безплатни плъгини. Както обикновено, работата най-често могат да свършат и тези от първата група, достатъчно е да намерите най-подходящото конкретно за вас решение. А най-хубавото е, че нищо не ви пречи да опитате всеки от подбраните плъгини, преди да решите. (И, нека споменем още веднъж, резултатът бързо може да бъде проверен с помощта на Google Lighthouse).

В безплатния спектър с доста добър рейтинг се откроява SuperPWA. Със сигурност, ако сте се насочили към тази част от избора, бихме ви препоръчали да го опитате. Другите, които логично следват в списъка, са PWA – плъгин, който разделя приложението на блокове, правейки ги удобна и естествена част от цялостното WP PWA приложение, PWA for WP & AMP и WebSuite PWA.

В сферата на платените плъгини, твърдят, е добро решение да се опита Simple PWA for WordPress by Webkul, което за $49 едва ли не само конвертира цялата ви апликация, без да се налага да се замисляте и да проверявате. Дали е така, няма как да потвърдим, не ни се даваха тези пари за експерименти, но ще се радваме, ако ни споделите своите впечатления.

 

Технология на промяната

Който и от плъгините в списъка ни да изберете, оттам нататък нещата са лесни. Всеки от тях е напълно стандартен, минава през обичайния път за добавяне на разширение към вашата страница: WordPress Admin > Plugins > Add New > Search, сваляне и инсталиране.

Никое от тези решения не изисква кой знае какви допълнителни настройки, би трябвало базовите да ви свършат достатъчно работа. Разбира се, винаги има и специални обстоятелства, но, наистина, най-лесният и работещ подход е в пробата и грешката.

И това важи винаги, щом се стигне до такава тема. Нещата в WordPress света бързо се променят, той е страшно динамичен. Плъгинът, който е препоръчан днес, скоро може да спре да бъде поддържан от създателите си. Този, който работи най-добре за вашата версия на платформата и вашите допълнителни особености, може да не се припокрива с оптималния за колегата ви. Разбира се, за да се отпуснете в експерименти, хубаво е да ги правите на копие на оригиналния си сайт, защото платформата в наши дни е доста съвършена и грешките би трябвало да са изключение, но… всичко се случва.

Прогресът идва скоро, времето на прогресивните апликации приближава. Чакаме ви на борда! А ако още събирате смелост за първия си сайт – всичко, което ви трябва, за да започнете, можете да намерите тук.

<a href="https://www.zettahost.bg/author/georgik/" target="_self">Георги Караманев</a>

Георги Караманев

Георги е журналист, писател и Front-end програмист – част от екипа на ZETTAHOST.bg. Има повече от 15 години опит в подготвянето на публикации на технологична тематика за Списание 8, в. „24 часа“ и други медии. През 2019 г. и 2021 г. получи наградите в категория „Технологии и иновации“ от конкурса на Dir.bg за чиста журналистика Web Report.
Последвайте ни

Най-нови публикации:

Какво е CDN и кога има смисъл да го използваме

Отваряш си сайта и се зарежда на микросекундата. Отваря го някой на другия край на света и… същата работа. Да, бързината е страшно важна онлайн, но нещо такова просто не би трябвало да е възможно?! Нали все пак има физически ограничения за скоростта, с която...

Stack Overflow. Светая светих на програмистите

Пуснете на някой програмист мийм или шегичка, че ако този сайт спре, всички програмисти са обречени. Ще видите, ще ви се посмее. Ама най-често ще се смее плахо и леко притеснено, защото може да се замисли по темата. Ами ако наистина един ден Stack Overflow реши да си...

Като на картинка. Как да намерим най-хубавите безплатни снимки?

Сайтовете се нуждаят от яки снимки, за да привличат гости? Не думай! Обаче търсенето на изображения, които няма да те изправят пред съд, защото си пропуснал бащиното име на автора на една снимка, понякога е предизвикателство. Изображенията много често са обект на...

7 случая, в които най-големите избират WordPress

„WordPress е най-доброто решение за сайта ви, ако тепърва започвате“. Тази манта, може би сте я чували и чели доста често. Особено, ако наистина за вас е дошъл моментът да си направите сайт и избирате най-подходящата технология, чрез която това да се случи. (Ето тук...

По буквите посрещат… Изберете си шрифт!

Време е да си направите сайт? Ако се чудите за хостинга – тук е мястото, където можете да опитате това, което ние предлагаме, съвсем безплатно. Има обаче и толкова много други въпроси, на които трябва да дадете своите отговори. На пръв погледът изборът на подходящи за...

Личен сайт безплатно!

Регистрирай се безплатно и си направи сайт още днес.

Безплатната хостинг услуга на ZETTAHOST.bg няма скрити такси и изисквания за ползване.

Безплатен хостинг

Pin It on Pinterest

Share This