{"id":19745745,"url":"https://github.com/argil-data/adaptive-serving-network-aware-demo","last_synced_at":"2025-02-27T23:47:47.537Z","repository":{"id":256445123,"uuid":"855086600","full_name":"argil-data/adaptive-serving-network-aware-demo","owner":"argil-data","description":"Delivering different assets based on the quality of the user's network connection","archived":false,"fork":false,"pushed_at":"2024-09-10T20:00:39.000Z","size":220,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-01-10T20:47:26.778Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/argil-data.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-09-10T09:30:26.000Z","updated_at":"2024-09-10T20:00:43.000Z","dependencies_parsed_at":"2024-09-10T19:48:14.940Z","dependency_job_id":"8d535997-5720-4df6-a86f-a6c1fc6544bb","html_url":"https://github.com/argil-data/adaptive-serving-network-aware-demo","commit_stats":null,"previous_names":["argil-data/adaptive-serving-network-aware-demo"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/argil-data%2Fadaptive-serving-network-aware-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/argil-data%2Fadaptive-serving-network-aware-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/argil-data%2Fadaptive-serving-network-aware-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/argil-data%2Fadaptive-serving-network-aware-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/argil-data","download_url":"https://codeload.github.com/argil-data/adaptive-serving-network-aware-demo/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241077196,"owners_count":19905725,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-12T02:11:13.061Z","updated_at":"2025-02-27T23:47:47.513Z","avatar_url":"https://github.com/argil-data.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Adaptive Serving Network Aware Demo\n\nDelivering different assets based on the quality of the user's network connection\n\n---\n\nCe projet est une démonstration d'adaptive serving en fonction du type de connexion réseau, utilisant l'API Network Information de JavaScript. Le but est de charger dynamiquement un contenu adapté à la bande passante ou au statut hors ligne de l'utilisateur pour améliorer l'expérience utilisateur, tout en tenant compte des principes de **GreenIT**, de **Digital Sustainability**, et de **Low-Energy Web Development**.\n\n## 🚀 Fonctionnalités\n\n- **Détection du type de connexion réseau** : 2G, 3G, 4G, Wi-Fi, Ethernet.\n- **Contenu adapté** : Le contenu haute ou basse résolution est servi en fonction de la qualité de la connexion.\n- **Gestion du statut hors ligne** : Un contenu spécifique est affiché lorsque l'utilisateur est hors ligne.\n- **Responsive** et optimisé pour une consommation énergétique réduite grâce à l'adaptive serving.\n\n## 📋 Prérequis\n\nAvant de commencer, assurez-vous d'avoir installé ou configuré les éléments suivants sur votre machine :\n\n- **Node.js** (version 12 ou supérieure)\n- Un navigateur supportant l'API **Network Information** :\n  - Chrome 61+ (Desktop et Mobile)\n  - Edge 79+\n  - Opera 47+\n\n\u003e ⚠️ **Note importante** : L'API Network Information n'est pas supportée sur **Safari** (iOS) et **Firefox Android**.\n\n## 🔧 Installation\n\n1. **Clonez le dépôt :**\n\n   ```bash\n   git clone [repository]\n   ```\n\n2. **Accédez au répertoire du projet :**\n\n3. **Installez les dépendances (si nécessaire) :**\n\n   ```bash\n   pnpm install\n   ```\n\n4. **Lancez le serveur de développement :**\n\n   Vous pouvez utiliser un serveur local pour servir le projet. Si vous avez `live-server` installé, lancez simplement :\n\n   ```bash\n   live-server\n   ```\n\n   Sinon, vous pouvez installer `http-server` :\n\n   ```bash\n   npm install -g http-server\n   http-server\n   ```\n\n5. **Ouvrez votre navigateur :**\n\n   Visitez l'URL fournie (en général `http://localhost:8080`) et testez la démo.\n\n## 🖥️ Démonstration\n\nLorsque vous chargez la page, le type de connexion est détecté automatiquement et un contenu approprié est affiché. Utilisez l'inspecteur dans les outils de développement pour modifier le type de connexion et voir comment le contenu s'adapte.\n\n- **4G / Wi-Fi** : Affichage du contenu en haute résolution.\n- **3G** : Affichage du contenu en basse résolution.\n- **2G / slow-2G** : Affichage du contenu très basse résolution pour minimiser l'utilisation des données.\n- **Hors ligne** : Affichage d'un contenu simplifié pour les utilisateurs déconnectés.\n\n## 📚 Ressources et documentation\n\nVoici des ressources utiles pour mieux comprendre l'API Network Information et le concept d'adaptive serving :\n\n- [MDN Web Docs - Network Information API](https://developer.mozilla.org/fr/docs/Web/API/Network_Information_API)\n- [Google Developers - Network Information API](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/network-information)\n- [W3C Specification for Network Information API](https://www.w3.org/TR/netinfo/)\n\n### Articles sur l'optimisation de contenu adaptatif :\n\n- [Low-Energy Web Development - A Guide](https://www.lowtechmagazine.com)\n- [Adaptive Serving for Sustainable Web Design](https://www.greenit.fr)\n\n## 🛠️ Contribution\n\nLes contributions sont les bienvenues ! Si vous souhaitez améliorer ce projet, suivez les étapes suivantes :\n\n1. Fork le projet\n2. Créez une nouvelle branche (`git checkout -b feature/Amélioration`)\n3. Faites vos modifications\n4. Créez une Pull Request\n\n## 📜 Licence\n\nCe projet est sous licence MIT - voir le fichier [LICENSE](LICENSE) pour plus de détails.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fargil-data%2Fadaptive-serving-network-aware-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fargil-data%2Fadaptive-serving-network-aware-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fargil-data%2Fadaptive-serving-network-aware-demo/lists"}