feat : 최적화를 위한 여러 패키지 추가

Author: sunub

.github/workflows/playwright.yml

@@ -0,0 +1,27 @@
+name: Playwright Tests
+on:
+  push:
+    branches: [ main, master ]
+  pull_request:
+    branches: [ main, master ]
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version: lts/*
+    - name: Install dependencies
+      run: npm install -g pnpm && pnpm install
+    - name: Install Playwright Browsers
+      run: pnpm exec playwright install --with-deps
+    - name: Run Playwright tests
+      run: pnpm exec playwright test
+    - uses: actions/upload-artifact@v4
+      if: ${{ !cancelled() }}
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30

frontend/package.json

@@ -30,31 +30,41 @@
     "framer-motion": "^11.12.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "recoil": "^0.7.7",
     "socket.io-client": "^4.8.1",
     "tailwind-merge": "^2.5.4",
     "three": "^0.171.0"
   },
   "devDependencies": {
     "@eslint/js": "^9.13.0",
+    "@playwright/test": "^1.51.0",
     "@tanstack/router-cli": "^1.79.0",
     "@tanstack/router-devtools": "^1.81.1",
     "@tanstack/router-plugin": "^1.79.0",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/react": "^16.2.0",
     "@types/node": "^22.9.0",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
     "@vitejs/plugin-react": "^4.3.3",
     "autoprefixer": "^10.4.20",
+    "cssnano": "^7.0.6",
     "eslint": "^9.13.0",
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.14",
     "globals": "^15.11.0",
+    "jsdom": "^26.0.0",
     "msw": "^2.6.4",
     "postcss": "^8.4.48",
     "prettier": "^3.3.3",
+    "rollup-plugin-visualizer": "^5.14.0",
+    "sharp": "^0.33.5",
     "tailwindcss": "^3.4.14",
     "typescript": "~5.6.3",
     "typescript-eslint": "^8.11.0",
     "vite": "^5.4.10",
+    "vite-plugin-compression2": "^1.3.3",
+    "vite-plugin-image-optimizer": "^1.1.8",
     "vite-tsconfig-paths": "^5.1.3",
     "vitest": "^2.1.4"
   },