Snippet 7 – Corregir CDN

Uno de los problema de trabajar con diversas IAs es que de repente enlazan a versiones antiguas, o a espejos bloqueados o muertos de librerías java o de maquetado.

Un CDN (Content Delivery Network) es lo que se llama una red de distribución de contenidos, y se empezó a usar hace muchos años para distribuir imágenes grandes de un solo archivo o incluso streaming. Por ejemplo, Netflix tiene redes locales de CDN y utiliza la más cercana a tu domicilio. En el pasado, Rackspace te permitía crear tu propio CDN, aunque a ese proveedor dejé de usuarlo por cuestiones de precio y falta de calidad, poco antes de la pandemia.

Akamai es una de las empresas pioneras en servicios CDN. Aunque muchos la conocen por otros servicios, hasta donde sé comenzó precisamente como una red de distribución de contenidos.

Nuestro problema Cada una de las IAs muestra el CDN que considera más confiable cuando la entrenaron. También existen limitaciones en entornos air-gapped, cuando no tienes red y debes llamar archivos locales. Parte del problema de trabajar con varias IAs es que cada una puede recurrir a un CDN distinto. Lo mejor es usar un solo CDN resistente, y el primer paso es unificar a un mismo CDN.

Yo estoy utilizando jsDelivr, porque en 2025–2026 es el que se percibe como más confiable en México.

Uno de los mas frecuntes antiguos era stackpath, y en un sitio que me puse a revisar donde almaceno snippets, me salieron unos 250 archivos con cambios. Vale la pena destacar que en dos casos solo tuve que cambiar poco, por ejemplo fa fa-clock a fas-fa-clock.

El estandard que yo trato de seguir es 4.6.2 de Bootstrap, 5.15.4 de Font awesome y 3.7.1 de jquery completo, no slim y usar bundle de bootstrap para quitar popper. Si, sube un poco el tamaño que va al navegador, pero son menos dependencias para controlar.

Riesgos de usar StackPath o similares

  • Disponibilidad poco confiable: Algunos enlaces pueden fallar al cargar (el código es correcto pero no te muestran nada aunque ves el archivo individual).
  • Sin actualizaciones: El CDN obsoleto no servirá versiones más recientes de Bootstrap.
  • Problemas de seguridad: Los puntos de acceso de un CDN desactualizado pueden no recibir parches.

En este momento estoy revisando unos 60 archivos generados por IA en 2025, para decidir cuáles puedo subir a repositorios y cuáles no. Me encontré con el problema de un desorden en los archivos, y además algunos incluyen el atributo integrity, que es un mecanismo de control utilizado en los enlaces de recursos externos para verificar que el archivo descargado no haya sido alterado.

Le pedí a Gemini que me hiciera un Snippet para corregir cdn , y agregué versiones viejas que localizo. Porque es eso ?
Pues no es raro que Una Ia  ponga por ejemplo 4.5.2 cuando la mas moderna es 4.6.2 , lo mismo pasa con font awesome que prefieron usar las 5.x que las 6.x que depende de fonts de google.
Además queremos que el script no entre desde cualquier Ip, hay que editarlo, y que nos diga si hay marca de inicio de archivo, (que es malo),  número de lineas y si puede si es UTF8 que a veces es la base de los problemas.
También puse slim, por jquery 3.7.1 , ya que por 16k prefiero tener completo jquery aunque rara vez lo use.
Por cierto, actualicé en favoritos vibecoding de gemini y grok, de 5.3 bootstrap y 6.5.2 de Font awesome, a mi estandard con la ayuda de Claude. Ya lo puse en repositorio,  Pero no afecta porque fueron creo que seghundo y tercer lugar contra mi respuesta.
Le pasé este prompt a gemini para el snippet:

Prompt unificado para blog

Quiero un código en PHP procedural que utilice Bootstrap 4.6.x desde jsDelivr y cumpla con lo siguiente:

  1. Función principal:
    • Buscar recursivamente todos los archivos .php en un directorio y sus subdirectorios.
    • Abrir cada archivo y verificar si contiene alguna de las siguientes cadenas de CDN obsoletos:
      • maxcdn.bootstrapcdn.com
      • stackpath.bootstrapcdn.com
      • code.jquery.com
      • Además, detectar si existe cloudflare.com
    • Mostrar únicamente los archivos que contienen alguna de estas cadenas y que pueda yo agregar nuevas.
    • Contar cuántas veces aparecen en cada archivo para saber qué debo actualizar en el directorio.
    • Acceso por IP Editable y si no es, dar aviso e imperdir ejecución.
  2. Columna adicional:
    • Indicar si el archivo contiene la palabra integrity.
    • Mostrar un badge verde si NO contiene integrity.
    • Mostrar un badge rojo si contiene integrity.
  3. Columnas Adicionales
    • Detecta si es posible BOM (Marca de inicio del archivo)
    • Detecta si es posible UTF8
    • Numero de lineas
  4. Espacio inferior:
    • Dejar un espacio en blanco al final de la tabla para mejorar la vista
  5. Barra de navegación y footer:
    • Barra de navegación fija arriba, simple, que identifique el modelo IA
    • Footer fijo abajo, para confirmar que la página se renderiza completa.
  6. Otra columna adicional:
    1. Indicar si el archivo contiene la palabra Licencia.
    2. Mostrar un badge verde si NO contiene Licencia.
    3. Mostrar un badge rojo si contiene Licencia.

Salida en un solo archivo.

Fin de Prompt.

El codigo esta en :

https://github.com/AlfonsoOrozcoAguilarnoNDA/snippetsMIT/blob/main/snippetcorregirCDN.php

 

Related Posts

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *