{"id":84,"date":"2021-07-07T09:28:52","date_gmt":"2021-07-07T09:28:52","guid":{"rendered":"https:\/\/carlosfabuel.com\/?p=84"},"modified":"2021-11-15T17:14:22","modified_gmt":"2021-11-15T17:14:22","slug":"error-de-concepto-al-usar-formato-svg","status":"publish","type":"post","link":"https:\/\/carlosfabuel.com\/error-de-concepto-al-usar-formato-svg\/","title":{"rendered":"Error de concepto al usar formato SVG"},"content":{"rendered":"
<\/div>\n
\n
<\/div>\n<\/div>\n
\n
\n
Como\u00a0#SEO<\/a>\u00a0y frontend developer a veces ves cosas dignas de figurar en lo m\u00e1s alto, pero otras veces ves cosas inexplicables.
\nAdjunto foto donde se ve el c\u00f3digo fuente de un svg de unos 140kB para una imagen de unos 100 p\u00edxeles.
\nAl abrirlo, ves que est\u00e1 embebido un png de 1600 p\u00edxeles de anchura y luego escalado cien veces para hacerlo peque\u00f1o.<\/span><\/span><\/span>Me imagino la cara de satisfacci\u00f3n del\u00a0
#backenddeveloper<\/a>\u00a0pensando en que cuando un usuario suba al editor web una imagen de 3000 p\u00edxeles se le va a quedar peque\u00f1ita. No hace falta decir que esto es un problema que se puede solucionar mucho mejor.
\nLo ideal es crear las im\u00e1genes que necesites a partir de lo que suba el usuario.Lo peor es que seguramente ser\u00e1 la mejor opci\u00f3n para el problema en el que estaba pensando…<\/p>\n

<use xlink:href=\u00bb#image0<\/a>\u00bb transform=\u00bbtranslate(0 -0.000769255) scale(0.000625 0.00111779)\u00bb\/>
\n<\/pattern>
\n<image id=\u00bbimage0″ width=\u00bb1600″ height=\u00bb896″ xlink:href=\u00bbdata:image\/png;base64,<\/defs><\/p>\n

Visto en\u00a0#worten<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

A veces nos enfrentamos a problemas complicados que no resolvemos de la forma m\u00e1s adecuada posible. Al menos para un observador externo. En este caso vemos como desde worten quer\u00edan hacer una imagen peque\u00f1ita de una imagen grande que hab\u00eda subido el usuario. El resultado es pat\u00e9tico desde un punto de vista de la programaci\u00f3n pero totalmente funcional desde un punto de vista del usuario. Salvo por el excesivo tama\u00f1o que ocupa la imagen resultante.<\/p>\n","protected":false},"author":2,"featured_media":85,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"_links":{"self":[{"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/posts\/84"}],"collection":[{"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/comments?post=84"}],"version-history":[{"count":3,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/posts\/84\/revisions"}],"predecessor-version":[{"id":105,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/posts\/84\/revisions\/105"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/media\/85"}],"wp:attachment":[{"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/media?parent=84"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/categories?post=84"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/carlosfabuel.com\/wp-json\/wp\/v2\/tags?post=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}