Performance mobile test

.github/workflows/Lighthouse&Pagespeed.yml

@@ -0,0 +1,63 @@
+name: Ligthhouse and Pagespeed Insights
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+  # Allow manual trigger
+  workflow_dispatch:
+  # Run daily to update badges
+  #schedule:
+  #  - cron: '0 0 * * *'
+
+jobs:
+  lighthouse:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Install Lighthouse CI
+        run: npm install -g @lhci/cli@0.13.x
+
+      - name: Run Lighthouse CI
+        run: |
+          lhci autorun \
+            --collect.url=${{ secrets.SITE_URL || 'http://localhost:3000' }} \
+            --upload.target=temporary-public-storage
+        env:
+          LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }}
+
+      #- name: Run PageSpeed Insights and Generate Badges
+      #  uses: jakepartusch/psi-action@v1.3
+      #  with:
+      #    url: ${{ secrets.SITE_URL || 'http://localhost:3000' }}
+      #    strategy: mobile
+      #    threshold: 70
+      #   key: ${{ secrets.PSI_API_KEY }}
+
+      - name: Generate Badges
+        run: |
+          # Create badges directory if it doesn't exist
+          mkdir -p badges
+
+          # Generate badges using shields.io
+          curl -o badges/performance.svg "https://img.shields.io/badge/dynamic/json?label=Performance&query=$.categories.performance.score&url=https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${{ secrets.SITE_URL }}&key=${{ secrets.PSI_API_KEY }}&strategy=mobile&multiply=100&style=flat&logo=lighthouse&suffix=%"
+
+          curl -o badges/accessibility.svg "https://img.shields.io/badge/dynamic/json?label=Accessibility&query=$.categories.accessibility.score&url=https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${{ secrets.SITE_URL }}&key=${{ secrets.PSI_API_KEY }}&strategy=mobile&multiply=100&style=flat&logo=lighthouse&suffix=%"
+
+          curl -o badges/best-practices.svg "https://img.shields.io/badge/dynamic/json?label=Best%20Practices&query=$.categories.best-practices.score&url=https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${{ secrets.SITE_URL }}&key=${{ secrets.PSI_API_KEY }}&strategy=mobile&multiply=100&style=flat&logo=lighthouse&suffix=%"
+
+          curl -o badges/seo.svg "https://img.shields.io/badge/dynamic/json?label=SEO&query=$.categories.seo.score&url=https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${{ secrets.SITE_URL }}&key=${{ secrets.PSI_API_KEY }}&strategy=mobile&multiply=100&style=flat&logo=lighthouse&suffix=%"
+
+      - name: Commit and Push Badges
+        run: |
+          git config --global user.name 'GitHub Action'
+          git config --global user.email 'action@github.com'
+          git add badges/
+          git commit -m "Update PageSpeed Insights badges" || exit 0
+          git push

.github/workflows/cd-audit.yml

@@ -0,0 +1,62 @@
+name: CD - Audit
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+  # Activacion manual 
+  workflow_dispatch:
+
+jobs:
+  deploy-and-audit:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+
+      - name: Setup PNPM
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build website
+        run: pnpm build
+
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./dist  # Adjust this to your build output directory
+
+      # Wait for GitHub Pages deployment to complete
+      - name: Wait for deployment
+        run: |
+          # Extract repository name for the URL
+          REPO_NAME=${GITHUB_REPOSITORY#*/}
+          # Wait for GitHub Pages to be ready (usually takes 1-2 minutes)
+          sleep 120
+          # Store the GitHub Pages URL
+          echo "SITE_URL=https://${{ github.repository_owner }}.github.io/$REPO_NAME" >> $GITHUB_ENV
+
+      # Run Unlighthouse audit
+      - name: Install Unlighthouse
+        run: pnpm add -g @unlighthouse/cli
+
+      - name: Run Unlighthouse audit
+        run: unlighthouse-ci --site ${{ env.SITE_URL }} --config unlighthouse.config.ts
+
+      # Upload results as artifacts
+      - name: Upload Unlighthouse results
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: unlighthouse-results
+          path: .unlighthouse

.github/workflows/pagespeed.yml

@@ -0,0 +1,38 @@
+name: PageSpeed Insights
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+  # Activacion manual :)
+  workflow_dispatch:
+
+jobs:
+  lighthouse:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Install Lighthouse CI
+        run: npm install -g @lhci/cli@0.13.x
+
+      - name: Run Lighthouse CI
+        run: |
+          lhci autorun \
+            --collect.url=${{ secrets.SITE_URL || 'http://localhost:3000' }} \
+            --upload.target=temporary-public-storage
+        env:
+          LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }}
+
+      - name: Run PageSpeed Insights
+        uses: jakepartusch/psi-action@v1.3
+        with:
+          url: ${{ secrets.SITE_URL || 'http://localhost:3000' }}
+          strategy: mobile
+          threshold: 50 #deberia ser 70 pero es que sale muy muy mal ....
+          api_key: ${{ secrets.PSI_API_KEY }}

.github/workflows/unlighthouse.yml

@@ -0,0 +1,34 @@
+name: Unlighthouse Audit
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+  # Activacion manual 
+  workflow_dispatch:
+
+jobs:
+  audit:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+
+      - name: Install Unlighthouse
+        run: npm install -g unlighthouse
+
+      - name: Run Unlighthouse
+        run: unlighthouse ci --site https://ulp.ugr.es --site-key ulp-ugr --budget '{"performance":90,"accessibility":90,"best-practices":90,"seo":90}'
+        # en el budget he definido los valores que considero aceptables para cada uno de los aspectos que se puede medir
+        # los valores que yo es puesto son completamente subjetivos, y he puesto 90 porque me ha dado la gana jaja
+
+      - name: Upload results
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: unlighthouse-report
+          path: .unlighthouse

.lighthouse.js

@@ -0,0 +1,32 @@
+module.exports = {
+  ci: {
+    collect: {
+      // Number of runs to do per URL
+      numberOfRuns: 3,
+      // Settings for collecting Lighthouse results
+      settings: {
+        preset: 'desktop',
+        chromeFlags: ['--disable-gpu', '--no-sandbox', '--no-zygote'],
+      },
+      // You can add multiple URLs to test
+      url: ['http://localhost:3000']
+    },
+    assert: {
+      // Add assertions here to enforce score thresholds
+      assertions: {
+        'categories:performance': ['warn', {minScore: 0.9}],
+        'categories:accessibility': ['warn', {minScore: 0.9}],
+        'categories:best-practices': ['warn', {minScore: 0.9}],
+        'categories:seo': ['warn', {minScore: 0.9}],
+        'first-contentful-paint': ['warn', {maxNumericValue: 2000}],
+        'interactive': ['warn', {maxNumericValue: 3500}],
+        'largest-contentful-paint': ['warn', {maxNumericValue: 2500}],
+      }
+    },
+    upload: {
+      // Upload target for the results
+      target: 'temporary-public-storage',
+      // You can also use other targets like 'lhci' if you have a Lighthouse CI Server
+    },
+  },
+};

README.md

@@ -5,7 +5,14 @@
 
 # ULP Website
 
-Página web oficial de la UGR LAN Party.
+[Página web oficial de la UGR LAN Party](https://ulp.ugr.es)
+
+
+![Chromium HSTS preload](https://img.shields.io/hsts/preload/ulp.ugr.es)
+![Mozilla HTTP Observatory Grade](https://img.shields.io/mozilla-observatory/grade-score/ulp.ugr.es)
+
+[Performance](https://googlechrome.github.io/lighthouse/viewer/?gist=521d3ce3747c754c1b80dcae048bf21f)
+
 
 ## Instalación para desarrollo