Experimente de proiect WordExpress cu aducerea GraphQL la WordPress

În 2012, când Facebook a început să-și rearhitecteze aplicațiile mobile bazate pe HTML5 pentru a fi aplicații native iOS sau Android, compania a inventat GraphQL. Acest nou limbaj de interogare open source este prezentat ca un înlocuitor direct pentru REST. GraphQL oferă o modalitate mai eficientă de a susține volumul de interacțiune care are loc în aplicațiile Facebook în fiecare zi, dar este independent de baze de date și creat pentru a fi utilizat dincolo de Facebook.

Deși GraphQL este încă relativ nou, mari companii precum Intuit, Coursera, Pinterest și Shopify îl folosesc în producție. Luna trecută, GitHub a anunțat suportul GraphQL pentru API-ul său GitHub pentru a răspunde unora dintre dezavantajele arhitecturii REST.

GraphQL oferă o nouă modalitate de structurare a comunicării de la client la server care face preluarea datelor mai eficientă. În articolul său GraphQL în era API-urilor REST, Petr Bela rezumă diferența dintre cele două tipuri de arhitectură:

Puterea GraphQL vine dintr-o idee simplă - în loc să definească structura răspunsurilor pe server, flexibilitatea este oferită clientului. Fiecare cerere specifică ce câmpuri și relații dorește să le recupereze, iar GraphQL va construi un răspuns adaptat pentru această solicitare particulară. Avantaj: este nevoie de o singură călătorie dus-întors pentru a prelua toate datele complexe care altfel ar putea acoperi mai multe puncte finale REST și, în același timp, pentru a returna doar datele care sunt de fapt necesare și nimic mai mult.

Luna trecută, Facebook a anunțat că GraphQL iese din etapa de „previzualizare tehnică” și este acum gata de producție. A fost implementat în multe limbaje de programare diferite și a fost deja adoptat de companiile care doreau o modalitate mai eficientă de accesare a datelor.

WordExpress aduce GraphQL la WordPress

Ramsay Lanier, un dezvoltator front-end JavaScript care lucrează la nclud din Washington, DC, a creat o implementare WordPress bazată pe GraphQL numită WordExpress. Lanier nu este un fan al PHP și nu-i place să lucreze cu bucla sau șabloane, toate lucrurile care au cuprins istoricul cea mai mare parte a dezvoltării front-end WordPress. El a creat WordExpress ca o aplicație Node.js cu scopul de a înlocui PHP cu JavaScript pentru partea de prezentare a WordPress. Utilizează Express pe backend și componente React pe front. GraphQL se află între cele două pentru a prelua date din baza de date WordPress.

„Când am început inițial cu ideea pentru WordExpress, am vrut să folosesc API-ul REST, dar am descoperit că punctele finale existente nu erau ceea ce îmi doream”, a spus Lanier. „Aș ajunge să fiu nevoit să scriu o grămadă de puncte finale personalizate și să conectez apeluri împreună. Așa că m-am gândit să încerc GraphQL.”

El a descoperit că GraphQL este mai eficient decât REST, deoarece reduce călătoriile dus-întors la server, permițând dezvoltatorilor să se concentreze asupra datelor de care clientul are cu adevărat nevoie. Lanier a subliniat beneficiile legate de site-urile WordPress:

Cu GraphQL, clientul determină datele exacte de care are nevoie printr-o interogare GraphQL. Interogarea GraphQL are o funcție personalizată de rezolvare care determină modul în care sunt preluate acele date. În această funcție, puteți chiar accesa mai multe baze de date. De exemplu, cu WordPress aveți o bază de date MySQL, dar este posibil să aveți și o bază de date Mongo pentru o aplicație care stochează alte date care nu trebuie să fie relaționale. În funcția de rezolvare GraphQL, puteți efectua apeluri pentru a prelua date din ambele baze de date și a le trimite înapoi clientului într-un singur server dus-întors.

WordExpress, în forma sa actuală, este un bun loc de plecare pentru construirea de aplicații bazate pe JavaScript care utilizează WordPress pentru administrare. Lanier a spus că această configurație de dezvoltare îi permite să creeze componente ale paginilor web și aplicațiilor mult mai ușor decât cu șabloanele PHP.

„Cu React, fiecare componentă conține nu doar marcajul pentru afișarea lucrurilor, ci și stilul pentru acea componentă, datele de care are nevoie pentru a funcționa și, de asemenea, orice logică de interacțiune – totul într-unul sau două fișiere”, a spus el.

Provocările curente ale WordExpress: Compatibilitate cu pluginuri și redare pe partea serverului

În ciuda tuturor beneficiilor interesante ale interogărilor mai eficiente și a posibilității unui frontend bazat pe JavaScript, proiectul WordExpress are o serie de provocări serioase care ar face dificilă utilizarea în producție dincolo de o simplă instalare pe blog. Nu este compatibil cu marea majoritate a pluginurilor WordPress, deoarece majoritatea sunt scrise în PHP.

„În esență, am înlocuit întregul front-end, ceea ce înseamnă că orice plugin care afectează front-end-ul nu va face nimic”, a spus Lanier. „Cu toate acestea, puteți folosi cu siguranță pluginurile existente care afectează partea de administrare a lucrurilor (cum ar fi Advanced Custom Fields sau pluginul AWS S3). Orice lucru care manipulează modul în care datele WordPress sunt stocate în MySQL este încă utilizabil – trebuie doar să modificați schema și interogările GraphQL pentru a lucra cu ele.”

Cealaltă provocare majoră este să funcționeze randarea pe server, care este necesară pentru gestionarea unor lucruri precum SEO și metaetichete. Apollostack, pe care WordExpress îl folosește pentru a prelua datele și a le livra componentelor React, a adăugat recent suport timpuriu pentru redarea automată pe server.

„Am trecut de la utilizarea Facebook’s Relay la ApolloStack”, a spus Lanier. „Ambele sunt tehnologii destul de noi și nu sunt sigur dacă vreuna și-a dat seama cum să se ocupe foarte bine de redarea pe server. Nu m-am mai cercetat de câteva luni, iar lucrurile s-au mișcat destul de repede cu ApolloStack, așa că s-ar putea să-și fi dat seama până acum.”

Deocamdată, WordExpress este doar o dovadă de concept și Lanier a spus că nu are planuri să încerce să accepte pluginurile existente. Având în vedere că WordExpress nu poate utiliza în prezent teme și pluginuri, unele dintre cele mai bune părți ale ecosistemului WordPress, Lanier a spus că dezvoltatorii care folosesc această stivă sunt probabil mai interesați să păstreze puterea părții de administrare a WordPress.

„Îmi place administratorul WordPress”, a spus el. „Este foarte puternic și ușor de utilizat pentru a gestiona conținutul. WordExpress ar fi un punct de plecare pentru orice dezvoltator JavaScript care dorește să creeze aplicații WordPress folosind doar JavaScript.”

Scopul lui Lanier cu WordExpress este de a-l transforma într-un pachet npm care poate fi reutilizat într-o varietate de proiecte React diferite. El a publicat deja două pachete WordExpress npm care funcționează împreună: wordexpress-schema (se ocupă de schema GraphQL și setările de conexiune) și wordexpress-components (găzduiește în prezent primele două componente, WordExpressPage și WordExpressMenu). Deoarece proiectul este construit pe Node.js, dezvoltatorii pot folosi orice pachet npm pe care îl doresc, o consolare pentru compatibilitatea limitată a pluginurilor.

GraphQL și API-ul WP REST

Mulți dintre cei care prevăd că GraphQL va deveni un înlocuitor direct pentru REST sunt, de asemenea, de părere că cele două pot coexista. De fapt, Facebook a scris recent un ghid pentru împachetarea unui API REST în GraphQL.

„Este probabil ca dacă GraphQL se dovedește a fi eficient, va coexista cu API-urile REST”, a spus Petr Bela. „Unele API-uri vor folosi REST, altele vor folosi GraphQL. Unii ar putea să le susțină pe amândouă.” El prezice că va dura industriei de ani, poate chiar de un deceniu, pentru a trece complet de la REST la GraphQL.

WordExpress de la Lanier, care a trecut recent de 1.000 de stele pe GitHub, este în prezent singurul proiect open source care explorează public o implementare a WordPress bazată pe GraphQL. O căutare rapidă pe GitHub dezvăluie că mulți alții experimentează cu setări similare. Din fericire, GraphQL nu necesită modificări ale nucleului WordPress pentru a permite site-urilor să utilizeze API-ul pentru interogarea bazei de date.

Lanier a spus că apreciază munca celor care încearcă să îmbine API-ul WP REST în core și nu vede implementările GraphQL ca o amenințare pentru aceasta.

„Cred că munca pe care o fac cu API-ul REST este un lucru bun”, a spus el. „Cu siguranță trebuiau să facă acest pas. REST există de mult timp – GraphQL este încă destul de nou, așa că are sens să mergi pe ruta REST. De asemenea, mult mai mulți oameni știu să-l folosească. Lucrul frumos despre GraphQL este că îl puteți folosi pentru a încheia un API REST, astfel încât ambele să poată coexista.”

Posibilitatea ca WordExpress să depășească o simplă dovadă de concept depinde de feedback-ul din partea comunității. Lanier a spus că dezvoltatorii demonstrează interes pentru WordExpress, punând întrebări.

„Oamenii îl folosesc și se joacă cu el și (sper că) îl fac al lor”, a spus el. „Cred că interesul există. Pentru a o face cu adevărat fezabilă, totuși, aveți nevoie de o întreagă echipă de dezvoltatori care să facă din aceasta o opțiune de top.”

Lanier și-a luat recent un nou loc de muncă în care folosește React 100% și nu a avut ocazia să folosească WordPress de puțin timp, dar a spus că este deschis să exploreze colaborarea pentru a pregăti producția WordExpress.

„Dacă oamenii ar fi cu adevărat interesați și ar dori să se reunească pentru a deveni o soluție fezabilă, aș fi implicat 100% în asta”, a spus el.

Dezvoltatorii care doresc să îl testeze și să înceapă să dezvolte cu WordExpress vor avea nevoie de o înțelegere de bază a modului în care funcționează React. Lanier a scris documentație detaliată despre modul în care este configurată implementarea GraphQL și despre cum să extindă interogările și modelele de baze de date GraphQL. Site-ul WordExpress.io este o demonstrație live a codului, pe care o puteți găsi pe GitHub.