{"id":857,"date":"2021-11-15T20:46:06","date_gmt":"2021-11-16T01:16:06","guid":{"rendered":"http:\/\/gregorgonzalez.com.ve\/blog\/?p=857"},"modified":"2021-11-15T20:47:24","modified_gmt":"2021-11-16T01:17:24","slug":"algunas-ventajas-de-graphql","status":"publish","type":"post","link":"http:\/\/gregorgonzalez.com.ve\/blog\/algunas-ventajas-de-graphql\/","title":{"rendered":"Algunas ventajas de GraphQL"},"content":{"rendered":"<p>Anteriormente hab\u00eda hablado sobre las APIs de REST y el proceso que conlleva. Ahora explicar\u00e9 algunas diferencias en cuanto a las APIs de GraphQL.<\/p>\n<p>GraphQL es un lenguaje de manipulaci\u00f3n y consulta de datos para APIs. Tambi\u00e9n es un runtime para completar consultas con datos existentes. Es de c\u00f3digo abierto y fue desarrollado por Facebook en 2012 para luego ser publicado en 2015.<\/p>\n<p>&nbsp;<\/p>\n<h3>GraphQL tiene solo un endpoint<\/h3>\n<p>Una API REST puede manejar ambos, tanto un solo endpoint como m\u00faltiples, aunque el est\u00e1ndar de REST se utiliza mayormente m\u00faltiples endpoints seg\u00fan la secci\u00f3n y acci\u00f3n:<\/p>\n<p>Por ejemplo, un endpoint de REST seria:<\/p>\n<p>www.mipagina.com\/persons<\/p>\n<p>Y de all\u00ed manipular\u00edamos toda la informaci\u00f3n de una persona con las acciones POST, GET, DELETE, PUT, PATCH.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-858 aligncenter\" src=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Ejemplo-Acciones-API-REST.jpg\" alt=\"\" width=\"880\" height=\"360\" srcset=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Ejemplo-Acciones-API-REST.jpg 880w, http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Ejemplo-Acciones-API-REST-300x123.jpg 300w, http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Ejemplo-Acciones-API-REST-768x314.jpg 768w\" sizes=\"(max-width: 880px) 100vw, 880px\" \/><\/p>\n<p>Tendr\u00edamos que crear otros endpoints para manipular otros datos \u00ab\/\u00edtems\u00bb, \u00ab\/libros\u00bb, \u00ab\/facturas\u00bb, etc. Y a su vez cada acci\u00f3n.<\/p>\n<p>Mientras que en GraphQL solo existir\u00eda un endpoint<\/p>\n<p>www.mipagina.com\/graphql<\/p>\n<p>Com\u00fanmente llamado \u00abgraphql\u00bb pero puede tener cualquier otro nombre y es donde se realiza todas las consultas y acciones a trav\u00e9s de objetos.<\/p>\n<p>&nbsp;<\/p>\n<h3>GraphQL es auto documentado<\/h3>\n<p>Antiguamente muchas API deb\u00edan ser documentadas manualmente y hacer p\u00fablico los m\u00e9todos, par\u00e1metros, descripciones, acciones de cada funci\u00f3n. Esto a\u00f1ad\u00eda una tarea extra a los desarrolladores y deb\u00edan actualizar la documentaci\u00f3n con cada cambio. Actualmente tanto para GraphQL como REST poseen la funcionalidad de generar la documentaci\u00f3n autom\u00e1ticamente, generando una p\u00e1gina web donde se explica brevemente cada funci\u00f3n p\u00fablica, los par\u00e1metros necesarios y los tipos de dato que devuelve.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-859 aligncenter\" src=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Documentacion-GraphQL.jpg\" alt=\"\" width=\"586\" height=\"514\" srcset=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Documentacion-GraphQL.jpg 586w, http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Documentacion-GraphQL-300x263.jpg 300w\" sizes=\"(max-width: 586px) 100vw, 586px\" \/><\/p>\n<p>&nbsp;<\/p>\n<h3>Manejo de la cantidad de datos (datos insuficientes, datos excesivos)<\/h3>\n<p>Una limitaci\u00f3n de las API de REST es que, al hacer una consulta, devuelve datos fijos con los cuales fue programado. Esto conlleva a un problema de overfetching (datos excesivos) cuando buscas algo en particular y devuelve mucho m\u00e1s de lo que necesitas. El otro problema es underfetching (datos insuficientes) cuando buscas informaci\u00f3n general y solo obtienes datos espec\u00edficos, obligando a realizar otras consultas.<\/p>\n<p>GraphQL nos permite seleccionar los datos a obtener en la consulta porque realmente es un lenguaje de consulta (Graph Query Language), con la ventaja de que solo limitamos los datos que queremos y la respuesta es acorde a lo que necesitamos.<\/p>\n<p>Ejemplo de un objeto de consulta:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-860 aligncenter\" src=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/ejemplo-objeto.jpg\" alt=\"\" width=\"460\" height=\"349\" srcset=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/ejemplo-objeto.jpg 460w, http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/ejemplo-objeto-300x228.jpg 300w\" sizes=\"(max-width: 460px) 100vw, 460px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Permiti\u00e9ndonos seleccionar la cantidad justa de datos sin perder informaci\u00f3n ni obtener informaci\u00f3n de m\u00e1s.<\/p>\n<p>Aclaro para este problema de underfetching\/overfetching en API REST, simplemente debemos asegurarnos de construir nuestra API con los datos necesarios, nosotros nos encargar\u00edamos de tener las funciones necesarias para cada caso que se requiera.<\/p>\n<p>En cuanto a la versatilidad de los datos en GraphQL, tambi\u00e9n hay que tomar en cuenta que puede ser un riesgo de seguridad si se le permite obtener datos sensibles como contrase\u00f1as o cualquier informaci\u00f3n que no debe ser p\u00fablica.<\/p>\n<p>&nbsp;<\/p>\n<h3>Herramientas de consulta<\/h3>\n<p>Para API REST podemos contar con programas como POSTMAN, que nos ayudan en nuestro desarrollo, provee una plataforma de f\u00e1cil visualizaci\u00f3n de datos de env\u00edo\/respuesta, generaci\u00f3n de consultas y testing.<\/p>\n<p>Para GraphQL podemos usar herramientas como GraphiQL<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-861 aligncenter\" src=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Herramienta-de-consulta-GraphiQL.jpg\" alt=\"\" width=\"668\" height=\"358\" srcset=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Herramienta-de-consulta-GraphiQL.jpg 668w, http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/Herramienta-de-consulta-GraphiQL-300x161.jpg 300w\" sizes=\"(max-width: 668px) 100vw, 668px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Ambas tecnolog\u00edas son parte de nuestro d\u00eda a d\u00eda y es ideal aprender ambas para el caso de que nos toque trabajar con alg\u00fan proyecto que lo incluya.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Anteriormente hab\u00eda hablado sobre las APIs de REST y el proceso que conlleva. Ahora explicar\u00e9 algunas diferencias en cuanto a las APIs de GraphQL. GraphQL es un lenguaje de manipulaci\u00f3n y consulta de datos para APIs. Tambi\u00e9n es un runtime para completar consultas con datos existentes. Es de c\u00f3digo abierto y fue desarrollado por Facebook [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":862,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[298],"tags":[323,322],"_links":{"self":[{"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts\/857"}],"collection":[{"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/comments?post=857"}],"version-history":[{"count":4,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts\/857\/revisions"}],"predecessor-version":[{"id":866,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts\/857\/revisions\/866"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/media\/862"}],"wp:attachment":[{"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/media?parent=857"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/categories?post=857"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/tags?post=857"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}