diff --git a/tests/test_web.py b/tests/test_web.py
index 2d2e161..646e5e8 100644
--- a/tests/test_web.py
+++ b/tests/test_web.py
@@ -1,8 +1,7 @@
 import pytest
+from bs4 import BeautifulSoup
 from httpx import BasicAuth
 
-from yourss.youtube.utils import bs_parse
-
 
 @pytest.mark.anyio
 async def test_default(client):
@@ -58,7 +57,7 @@ async def test_page_content(client):
     resp = await client.get("/" + ",".join(names))
     assert resp.status_code == 200
 
-    soup = bs_parse(resp.text)
+    soup = BeautifulSoup(resp.text, features="html.parser")
     assert len(soup.find_all("div", class_="yourss-filterable")) == 45
 
     # when no valid feed given, should return 404
diff --git a/tests/test_youtube.py b/tests/test_youtube.py
index 7c3f0e4..18522a3 100644
--- a/tests/test_youtube.py
+++ b/tests/test_youtube.py
@@ -1,20 +1,15 @@
 from http.cookiejar import CookieJar
 
 import pytest
+from bs4 import BeautifulSoup
 from httpx import AsyncClient
 
-from yourss.youtube import (
-    YoutubeMetadata,
-    YoutubeRssApi,
-    YoutubeWebApi,
-)
-from yourss.youtube.scrapper import VideoScrapper
-from yourss.youtube.utils import bs_parse
+from yourss.youtube import PageScrapper, VideoScrapper, YoutubeApi
 
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_rgpd():
-    api = YoutubeWebApi()
+    api = YoutubeApi()
 
     url = "/@jonnygiger"
 
@@ -22,7 +17,7 @@ async def test_rgpd():
     assert resp.status_code == 200
     assert (
         len(
-            bs_parse(resp.text).find_all(
+            BeautifulSoup(resp.text, features="html.parser").find_all(
                 "form",
                 attrs={"method": "POST", "action": "https://consent.youtube.com/save"},
             )
@@ -34,7 +29,7 @@ async def test_rgpd():
     assert resp.status_code == 200
     assert (
         len(
-            bs_parse(resp.text).find_all(
+            BeautifulSoup(resp.text, features="html.parser").find_all(
                 "form",
                 attrs={"method": "POST", "action": "https://consent.youtube.com/save"},
             )
@@ -45,7 +40,7 @@ async def test_rgpd():
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_rss_channel():
-    api = YoutubeRssApi()
+    api = YoutubeApi()
 
     feed = await api.get_channel_rss("UCVooVnzQxPSTXTMzSi1s6uw")
     assert feed.title == "Jonny Giger"
@@ -53,7 +48,7 @@ async def test_rss_channel():
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_rss_playlist():
-    api = YoutubeRssApi()
+    api = YoutubeApi()
 
     feed = await api.get_playlist_rss("PLw-vK1_d04zZCal3yMX_T23h5nDJ2toTk")
     assert feed.title == "IMPOSSIBLE TRICKS OF RODNEY MULLEN"
@@ -61,35 +56,33 @@ async def test_rss_playlist():
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_metadata_channel():
-    api = YoutubeWebApi(AsyncClient(cookies=CookieJar()))
+    api = YoutubeApi(AsyncClient(cookies=CookieJar()))
 
     resp = await api.get_homepage("UCVooVnzQxPSTXTMzSi1s6uw")
-    meta = YoutubeMetadata.from_response(resp)
+    page = PageScrapper.from_response(resp)
+    meta = page.get_metadata()
     assert meta.title == "Jonny Giger"
     assert meta.channel_id == "UCVooVnzQxPSTXTMzSi1s6uw"
-    assert (
-        meta.url.geturl() == "https://www.youtube.com/channel/UCVooVnzQxPSTXTMzSi1s6uw"
-    )
+    assert meta.url == "https://www.youtube.com/channel/UCVooVnzQxPSTXTMzSi1s6uw"
     assert meta.avatar_url is not None
 
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_metadata_user():
-    api = YoutubeWebApi(AsyncClient(cookies=CookieJar()))
+    api = YoutubeApi(AsyncClient(cookies=CookieJar()))
 
     resp = await api.get_homepage("@jonnygiger")
-    meta = YoutubeMetadata.from_response(resp)
+    page = PageScrapper.from_response(resp)
+    meta = page.get_metadata()
     assert meta.title == "Jonny Giger"
     assert meta.channel_id == "UCVooVnzQxPSTXTMzSi1s6uw"
-    assert (
-        meta.url.geturl() == "https://www.youtube.com/channel/UCVooVnzQxPSTXTMzSi1s6uw"
-    )
+    assert meta.url == "https://www.youtube.com/channel/UCVooVnzQxPSTXTMzSi1s6uw"
     assert meta.avatar_url is not None
 
 
 @pytest.mark.asyncio(loop_scope="module")
 async def test_scrap_videos():
-    scrapper = VideoScrapper(YoutubeWebApi())
+    scrapper = VideoScrapper()
 
     page_iterator = scrapper.iter_videos("UCVooVnzQxPSTXTMzSi1s6uw")
     page1 = await anext(page_iterator)
diff --git a/yourss/async_utils.py b/yourss/async_utils.py
index 84f8a55..c915e37 100644
--- a/yourss/async_utils.py
+++ b/yourss/async_utils.py
@@ -3,45 +3,40 @@
 
 from .youtube import (
     Feed,
-    YoutubeMetadata,
-    YoutubeRssApi,
-    YoutubeWebApi,
+    YoutubeApi,
     is_channel_id,
     is_playlist_id,
     is_user,
 )
+from .youtube.scrapper import PageScrapper
 
 
-async def _fetch_feed(
-    name: str, *, rss_api: YoutubeRssApi, web_api: YoutubeWebApi
-) -> Feed:
+async def _fetch_feed(name: str, *, api: YoutubeApi) -> Feed:
     if is_playlist_id(name):
-        return await rss_api.get_playlist_rss(name)
+        return await api.get_playlist_rss(name)
 
     # if given id is a name, get the channel id
     if is_user(name):
-        meta = YoutubeMetadata.from_response(await web_api.get_homepage(name))
+        page = PageScrapper.from_response(await api.get_homepage(name))
+        meta = page.get_metadata()
         name = meta.channel_id
 
     # check valid channel id
     if not is_channel_id(name):
         raise ValueError(f"Invalid channel id: {name}")
 
-    return await rss_api.get_channel_rss(name)
+    return await api.get_channel_rss(name)
 
 
 async def afetch_feeds(
-    names: List[str], *, rss_api: YoutubeRssApi, web_api: YoutubeWebApi
+    names: List[str], *, api: YoutubeApi
 ) -> Dict[str, Feed | BaseException]:
     return {
         name: task
         for name, task in zip(
             names,
             await asyncio.gather(
-                *[
-                    _fetch_feed(name, rss_api=rss_api, web_api=web_api)
-                    for name in names
-                ],
+                *[_fetch_feed(name, api=api) for name in names],
                 return_exceptions=True,
             ),
         )
diff --git a/yourss/jsonutils.py b/yourss/jsonutils.py
deleted file mode 100644
index da5b0f9..0000000
--- a/yourss/jsonutils.py
+++ /dev/null
@@ -1,16 +0,0 @@
-from typing import Dict, Iterator, Type, TypeVar
-
-from jsonpath_ng import parse
-
-T = TypeVar("T")
-
-
-def json_iter(path: str, payload: Dict, cls: Type[T] | None = None) -> Iterator[T]:
-    for match in parse(path).find(payload):
-        out = match.value
-        if out is not None and (cls is None or isinstance(out, cls)):
-            yield out
-
-
-def json_first(path: str, payload: Dict, cls: Type[T] | None = None) -> T:
-    return next(json_iter(path, payload, cls=cls))
diff --git a/yourss/routers/proxy.py b/yourss/routers/proxy.py
index a8165aa..8458821 100644
--- a/yourss/routers/proxy.py
+++ b/yourss/routers/proxy.py
@@ -1,36 +1,30 @@
-from fastapi import APIRouter, Depends, HTTPException
+from fastapi import APIRouter, HTTPException
 from fastapi.responses import RedirectResponse
-from httpx import AsyncClient
 from pydantic import PositiveInt
 from starlette.status import HTTP_404_NOT_FOUND
 
 from ..youtube import (
-    YoutubeMetadata,
-    YoutubeRssApi,
-    YoutubeWebApi,
+    PageScrapper,
+    YoutubeApi,
     is_channel_id,
     is_playlist_id,
     is_user,
 )
 from .schema import ChannelId, Playlist_Id, UserId
-from .utils import force_https, get_youtube_web_client
+from .utils import force_https
 
 router = APIRouter()
 
 
 @router.get("/rss/{name}", response_class=RedirectResponse)
-async def rss_feed(
-    name: UserId | ChannelId | Playlist_Id,
-    yt_client: AsyncClient = Depends(get_youtube_web_client),
-):
-    api = YoutubeRssApi()
-    webapi = YoutubeWebApi(yt_client)
+async def rss_feed(name: UserId | ChannelId | Playlist_Id):
+    api = YoutubeApi()
 
     feed = None
     # if a user is provided, get the channel id
     if is_user(name):
-        homepage = await webapi.get_homepage(name)
-        meta = YoutubeMetadata.from_response(homepage)
+        homepage = PageScrapper.from_response(await api.get_homepage(name))
+        meta = homepage.get_metadata()
         name = meta.channel_id
 
     if is_channel_id(name):
@@ -46,13 +40,11 @@ async def rss_feed(
 
 
 @router.get("/avatar/{name}", response_class=RedirectResponse)
-async def avatar(
-    name: UserId | ChannelId, yt_client: AsyncClient = Depends(get_youtube_web_client)
-):
-    webapi = YoutubeWebApi(yt_client)
+async def avatar(name: UserId | ChannelId):
+    api = YoutubeApi()
 
-    homepage = await webapi.get_homepage(name)
-    meta = YoutubeMetadata.from_response(homepage)
+    homepage = PageScrapper.from_response(await api.get_homepage(name))
+    meta = homepage.get_metadata()
 
     if (url := meta.avatar_url) is None:
         raise HTTPException(
@@ -62,15 +54,13 @@ async def avatar(
 
 
 @router.get("/home/{name}", response_class=RedirectResponse)
-async def home(
-    name: UserId | ChannelId, yt_client: AsyncClient = Depends(get_youtube_web_client)
-):
-    webapi = YoutubeWebApi(yt_client)
+async def home(name: UserId | ChannelId):
+    api = YoutubeApi()
 
-    homepage = await webapi.get_homepage(name)
-    meta = YoutubeMetadata.from_response(homepage)
+    homepage = PageScrapper.from_response(await api.get_homepage(name))
+    meta = homepage.get_metadata()
 
-    return RedirectResponse(meta.url.geturl())
+    return RedirectResponse(meta.url)
 
 
 @router.get("/thumbnail/{video_id}", response_class=RedirectResponse)
diff --git a/yourss/routers/utils.py b/yourss/routers/utils.py
index 1ab744d..581475e 100644
--- a/yourss/routers/utils.py
+++ b/yourss/routers/utils.py
@@ -1,15 +1,7 @@
-from http.cookiejar import CookieJar
-from typing import AsyncGenerator, Callable, List
+from typing import Callable, List
 
-from httpx import AsyncClient
 from starlette.templating import Jinja2Templates, _TemplateResponse
 
-cookiejar = CookieJar()
-
-
-async def get_youtube_web_client() -> AsyncGenerator[AsyncClient, None]:
-    yield AsyncClient(cookies=cookiejar)
-
 
 def force_https(url: str) -> str:
     assert isinstance(url, str)
diff --git a/yourss/routers/web.py b/yourss/routers/web.py
index 51df3f6..a39292c 100644
--- a/yourss/routers/web.py
+++ b/yourss/routers/web.py
@@ -1,10 +1,11 @@
+import json
 from datetime import datetime
+from typing import Annotated
 
 import arrow
-from fastapi import APIRouter, Depends, HTTPException, Query, Request
+from fastapi import APIRouter, Cookie, Depends, HTTPException, Query, Request
 from fastapi.responses import RedirectResponse
 from fastapi.templating import Jinja2Templates
-from httpx import AsyncClient
 from jinja2 import Environment, FileSystemLoader
 from starlette.responses import HTMLResponse
 from starlette.status import HTTP_404_NOT_FOUND
@@ -15,8 +16,9 @@
 from ..schema import Theme, User
 from ..security import get_auth_user
 from ..settings import current_config, templates_folder
-from ..youtube import Feed, YoutubeRssApi, YoutubeWebApi
-from .utils import custom_template_response, get_youtube_web_client, parse_channel_names
+from ..youtube import Feed, PageScrapper, VideoScrapper, YoutubeApi
+from .schema import ChannelId, UserId
+from .utils import custom_template_response, parse_channel_names
 
 
 def clean_title(text: str) -> str:
@@ -33,13 +35,21 @@ def date_humanize(date: datetime) -> str:
 env = Environment(loader=FileSystemLoader(templates_folder))
 env.filters["clean_title"] = clean_title
 env.filters["date_humanize"] = date_humanize
-ViewTemplateResponse = custom_template_response(
+RssTemplateResponse = custom_template_response(
     Jinja2Templates(env=env),
-    "view.html",
+    "rss.html",
     version=yourss.__version__,
     open_primary=current_config.open_primary,
     open_secondary=current_config.open_secondary,
 )
+ChannelTemplateResponse = custom_template_response(
+    Jinja2Templates(env=env), "channel.html", version=yourss.__version__
+)
+ChannelVideosTemplateResponse = custom_template_response(
+    Jinja2Templates(env=env),
+    "partials/channel-videos-page.html",
+    version=yourss.__version__,
+)
 
 router = APIRouter()
 
@@ -47,7 +57,7 @@ def date_humanize(date: datetime) -> str:
 @router.get("/", response_class=RedirectResponse)
 async def root():
     return RedirectResponse(
-        router.url_path_for("view_channels", channels=current_config.default_channels)
+        router.url_path_for("rss_channels", channels=current_config.default_channels)
     )
 
 
@@ -59,20 +69,16 @@ async def watch(video: str = Query(alias="v", min_length=11, max_length=11)):
 
 
 @router.get("/u/{username}", response_class=HTMLResponse)
-async def get_user(
-    request: Request,
-    yt_client: AsyncClient = Depends(get_youtube_web_client),
-    theme: Theme | None = None,
-    user: User = Depends(get_auth_user),
+async def rss_user(
+    request: Request, theme: Theme | None = None, user: User = Depends(get_auth_user)
 ):
-    feeds = await afetch_feeds(
-        user.channels, rss_api=YoutubeRssApi(), web_api=YoutubeWebApi(yt_client)
-    )
+    api = YoutubeApi()
+    feeds = await afetch_feeds(user.channels, api=api)
     active_feeds = [f for f in feeds.values() if isinstance(f, Feed)]
     if len(active_feeds) == 0:
         raise HTTPException(status_code=HTTP_404_NOT_FOUND, detail="No channels found")
 
-    return ViewTemplateResponse(
+    return RssTemplateResponse(
         request=request,
         title=f"/u/{user.name}",
         feeds=active_feeds,
@@ -81,24 +87,68 @@ async def get_user(
 
 
 @router.get("/{channels}", response_class=HTMLResponse)
-async def view_channels(
-    request: Request,
-    channels: str,
-    yt_client: AsyncClient = Depends(get_youtube_web_client),
-    theme: Theme | None = None,
-):
-    feeds = await afetch_feeds(
-        parse_channel_names(channels),
-        rss_api=YoutubeRssApi(),
-        web_api=YoutubeWebApi(yt_client),
-    )
+async def rss_channels(request: Request, channels: str, theme: Theme | None = None):
+    api = YoutubeApi()
+    feeds = await afetch_feeds(parse_channel_names(channels), api=api)
     active_feeds = [f for f in feeds.values() if isinstance(f, Feed)]
     if len(active_feeds) == 0:
         raise HTTPException(status_code=HTTP_404_NOT_FOUND, detail="No channels found")
 
-    return ViewTemplateResponse(
+    return RssTemplateResponse(
         request=request,
         title=", ".join(sorted(map(lambda f: f.title, active_feeds))),
         feeds=active_feeds,
         theme=theme or current_config.theme,
     )
+
+
+@router.get("/c/{channel}", response_class=HTMLResponse)
+async def videos_channel(
+    request: Request, channel: ChannelId | UserId, theme: Theme | None = None
+):
+    api = YoutubeApi()
+    homepage = PageScrapper.from_response(
+        await api.get_homepage(channel, suffix="/videos")
+    )
+    metadata = homepage.get_metadata()
+    assert (client_data := homepage.find_client_data()) is not None
+    assert (browse_data := homepage.find_browse_data()) is not None
+
+    videos = list(browse_data.iter_videos())
+    if len(videos) == 0:
+        raise HTTPException(
+            status_code=HTTP_404_NOT_FOUND,
+            detail=f"No video found for channel {channel}",
+        )
+
+    out = ChannelTemplateResponse(
+        request=request,
+        metadata=metadata,
+        videos=videos,
+        theme=theme or current_config.theme,
+        click_tracking_params=browse_data.click_tracking_params,
+        continuation_token=browse_data.continuation_token,
+    )
+    out.set_cookie("client_data", json.dumps(client_data))
+    return out
+
+
+@router.get("/htmx/videos", response_class=HTMLResponse)
+async def next(
+    request: Request,
+    client_data: Annotated[str, Cookie()],
+    click_tracking_params: Annotated[str, Query()],
+    continuation_token: Annotated[str, Query()],
+):
+    scrapper = VideoScrapper()
+    browse_data = await scrapper.get_next_page(
+        json.loads(client_data), click_tracking_params, continuation_token
+    )
+    videos = list(browse_data.iter_videos())
+    out = ChannelVideosTemplateResponse(
+        request=request,
+        videos=videos,
+        click_tracking_params=browse_data.click_tracking_params,
+        continuation_token=browse_data.continuation_token,
+    )
+    return out
diff --git a/yourss/templates/channel.html b/yourss/templates/channel.html
new file mode 100644
index 0000000..cacc8a6
--- /dev/null
+++ b/yourss/templates/channel.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en" data-bs-theme="{{ theme }}">
+
+<head>
+  <title>/c/{{ metadata.title }} - YouRSS</title>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous" />
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1/font/bootstrap-icons.css" rel="stylesheet" />
+  <link href="/static/yourss.css" rel="stylesheet" />
+  <link rel="icon" type="image/png" href="/static/yourss.png" />
+  <link rel="apple-touch-icon" type="image/png" href="/static/yourss.png" />
+</head>
+
+<body>
+  <script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js" crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/js-cookie@3/dist/js.cookie.min.js "></script>
+
+  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+    <div class="container-fluid justify-content-center">
+      <a class="navbar-brand" href="{{ metadata.url }}" target="_blank">
+        <img src="{{ metadata.avatar_url }}" width="30" height="30" class="rounded-circle" />
+        <span class="fw-bold" style="cursor: pointer" onclick="window.open('/c/{{ metadata.channel_id }}')">
+          {{ metadata.title }}
+        </span>
+      </a>
+    </div>
+  </nav>
+
+  <a id="scroll-to-top" title="Back to top" href="#">&#10148;</a>
+
+  <main>
+    <div class="container-fluid mt-2">
+      <div id="video-container" class="row">
+        {% include "partials/channel-videos-page.html" %}
+      </div>
+    </div>
+  </main>
+  <script src="/static/yourss.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/yourss/templates/partials/channel-videos-page.html b/yourss/templates/partials/channel-videos-page.html
new file mode 100644
index 0000000..dae311b
--- /dev/null
+++ b/yourss/templates/partials/channel-videos-page.html
@@ -0,0 +1,19 @@
+{% for video in videos %}
+<div class="col-xxl-2 col-xl-3 col-lg-3 col-md-4 col-sm-6 mb-3 yourss-filterable" id="yourss-video-{{ video.video_id }}" {% if loop.last and continuation_token %} hx-get="/htmx/videos?click_tracking_params={{ click_tracking_params }}&continuation_token={{ continuation_token }}" hx-trigger="revealed" hx-swap="afterend" {% endif %}>
+    <div class="card h-100 shadow">
+        <img id="yourss-thumbnail-{{ video.video_id }}" class="card-img-top yourss-thumbnail" src="https://i2.ytimg.com/vi/{{ video.video_id }}/hqdefault.jpg" onclick="openEmbedded('{{ video.video_id }}')" style="cursor: pointer" alt="{{ video.title|escape }}" />
+        <div id="yourss-player-{{ video.video_id }}" class="yourss-player-container" style="display: none"></div>
+        <div class="card-body d-flex flex-column">
+            <p class="card-text fw-bold">
+                {{ video.title|escape }}
+            </p>
+            <p class="card-text mt-auto">
+                <small class="text-muted" title="{{ video.published }}">
+                    {{ video.published }}
+                </small>
+                <a class="bi bi-box-arrow-up-right" style="float: right" onclick="openTab('{{ video.video_id }}')" target="_blank"></a>
+            </p>
+        </div>
+    </div>
+</div>
+{% endfor %}
\ No newline at end of file
diff --git a/yourss/templates/view.html b/yourss/templates/rss.html
similarity index 82%
rename from yourss/templates/view.html
rename to yourss/templates/rss.html
index b4c4a81..9861036 100644
--- a/yourss/templates/view.html
+++ b/yourss/templates/rss.html
@@ -28,8 +28,7 @@
         </span>
       </a>
 
-      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
-        aria-label="Toggle navigation">
+      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>
       <div id="navbarSupportedContent" class="collapse navbar-collapse">
@@ -40,12 +39,6 @@
           </button>
           {% endfor %}
         </form>
-        <!-- 
-        <form class="d-flex">
-          <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
-          <button class="btn btn-outline-success" type="submit">Search</button>
-        </form> 
-        -->
         <button class="btn btn-outline-secondary" type="button" onclick="toggle_sort(this)">
           <i class="bi bi-sort-down"></i>
         </button>
@@ -60,17 +53,14 @@
       <div id="video-container" class="row">
         {% for feed in feeds %}
         {% for entry in feed.entries %}
-        <div class="col-xxl-2 col-xl-3 col-lg-3 col-md-4 col-sm-6 mb-3 yourss-filterable" id="yourss-video-{{ entry.video_id }}" data-feed-uid="{{ feed.uid }}"
-          data-feed-channel-id="{{ feed.channel_id }}" data-feed-url="{{ feed.get_url() }}" data-feed-title="{{ feed.title|escape }}" data-entry-title="{{ entry.title|clean_title|escape }}"
-          data-entry-video-id="{{ entry.video_id }}" data-entry-published="{{ entry.published }}">
+        <div class="col-xxl-2 col-xl-3 col-lg-3 col-md-4 col-sm-6 mb-3 yourss-filterable" id="yourss-video-{{ entry.video_id }}" data-feed-uid="{{ feed.uid }}" data-feed-channel-id="{{ feed.channel_id }}" data-feed-url="{{ feed.get_url() }}" data-feed-title="{{ feed.title|escape }}" data-entry-title="{{ entry.title|clean_title|escape }}" data-entry-video-id="{{ entry.video_id }}" data-entry-published="{{ entry.published }}">
           <div class="card h-100 shadow">
-            <img id="yourss-thumbnail-{{ entry.video_id }}" class="card-img-top yourss-thumbnail" src="{{ entry.media_info.thumbnail.url }}" onclick="{{ open_primary }}('{{ entry.video_id }}')"
-              style="cursor: pointer" alt="{{ entry.title|escape }}" />
-            <div class="yourss-player-container" id="yourss-player-{{ entry.video_id }}" style="display: none"></div>
+            <img id="yourss-thumbnail-{{ entry.video_id }}" class="card-img-top yourss-thumbnail" src="{{ entry.media_info.thumbnail.url }}" onclick="{{ open_primary }}('{{ entry.video_id }}')" style="cursor: pointer" alt="{{ entry.title|escape }}" />
+            <div id="yourss-player-{{ entry.video_id }}" class="yourss-player-container" style="display: none"></div>
             <div class="card-body d-flex flex-column">
               <h5 class="card-title h5">
                 <img src="/proxy/avatar/{{ feed.channel_id }}" width="30" height="30" class="rounded-circle" />
-                <span class="fw-bold" style="cursor: pointer" onclick="window.open('/proxy/home/{{ feed.channel_id }}')">
+                <span class="fw-bold" style="cursor: pointer" onclick="window.open('/c/{{ feed.channel_id }}')">
                   {{ feed.title }}
                 </span>
               </h5>
@@ -81,13 +71,6 @@ <h5 class="card-title h5">
                 <i class="new-item bi bi-record-fill text-primary" onclick="mark_as_read('{{ entry.published }}')">
                   <small class="text-muted" title="{{ entry.published }}">
                     {{ entry.published|date_humanize }}
-                    <script>
-                      let videoDate = new Date("{{ entry.published }}");
-                      let now = new Date();
-                      let diff = now - videoDate;
-                      let formatter = new Intl.RelativeTimeFormat("en", {})
-                      console.log(formatter.format(new Date("{{ entry.published }}") - Date.UTC()));
-                    </script>
                   </small>
                 </i>
                 <a class="bi bi-box-arrow-up-right" style="float: right" onclick="{{ open_secondary }}('{{ entry.video_id }}')" target="_blank"></a>
diff --git a/yourss/youtube/__init__.py b/yourss/youtube/__init__.py
index feca063..d04afe6 100644
--- a/yourss/youtube/__init__.py
+++ b/yourss/youtube/__init__.py
@@ -1,7 +1,10 @@
-from .client import YoutubeRssApi as YoutubeRssApi
-from .client import YoutubeWebApi as YoutubeWebApi
-from .metadata import YoutubeMetadata as YoutubeMetadata
+from .client import YoutubeApi as YoutubeApi
+from .model import BrowseData as BrowseData
+from .model import VideoDescription as VideoDescription
+from .model import YoutubeMetadata as YoutubeMetadata
 from .schema import Feed as Feed
+from .scrapper import PageScrapper as PageScrapper
+from .scrapper import VideoScrapper as VideoScrapper
 from .utils import is_channel_id as is_channel_id
 from .utils import is_playlist_id as is_playlist_id
 from .utils import is_user as is_user
diff --git a/yourss/youtube/client.py b/yourss/youtube/client.py
index b8c0e5b..f115834 100644
--- a/yourss/youtube/client.py
+++ b/yourss/youtube/client.py
@@ -1,26 +1,26 @@
 from dataclasses import dataclass
-from typing import Annotated, Any, Dict
+from typing import Annotated, Any, Dict, Literal
 
 from httpx import Response
 from pydantic import TypeAdapter
-from rapid_api_client import FormBody, Path, Query
+from rapid_api_client import Path, Query
 from rapid_api_client.annotations import JsonBody
 from rapid_api_client.async_ import AsyncRapidApi, get, post
 
 from .schema import Feed
 from .utils import (
-    MOZILLA_USER_AGENT,
     is_channel_id,
     is_user,
 )
 
 BASE_URL = "https://www.youtube.com"
-CHANNEL_RSS_URL = "/feeds/videos.xml?channel_id={channel_id}"
-PLAYLIST_RSS_URL = "/feeds/videos.xml?playlist_id={playlist_id}"
+MOZILLA_USER_AGENT = (
+    "Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/117.0"
+)
 
 
 @dataclass
-class YoutubeWebApi(AsyncRapidApi):
+class YoutubeApi(AsyncRapidApi):
     def __post_init__(self):
         self.client.base_url = BASE_URL
         self.client.follow_redirects = True
@@ -28,34 +28,25 @@ def __post_init__(self):
         self.client.headers["accept-language"] = "en"
         self.client.cookies.set("CONSENT", "YES+cb", domain=".youtube.com")
 
+    @get("/feeds/videos.xml?channel_id={channel_id}", response_class=Feed)
+    async def get_channel_rss(self, channel_id: Annotated[str, Path()]): ...
+
+    @get("/feeds/videos.xml?playlist_id={playlist_id}", response_class=Feed)
+    async def get_playlist_rss(self, playlist_id: Annotated[str, Path()]): ...
+
     @get("{path}")
     async def get_html(
         self, path: Annotated[str, Path()], ucbcb: Annotated[int, Query(default=1)]
     ): ...
 
-    @post("{path}")
-    async def post_html(
-        self, path: Annotated[str, Path()], form: Annotated[Dict, FormBody()]
-    ): ...
-
     @post("/youtubei/v1/browse", response_class=TypeAdapter(Dict[str, Any]))
     async def api_browse(self, data: Annotated[dict, JsonBody()]): ...
 
-    async def get_homepage(self, name: str) -> Response:
+    async def get_homepage(
+        self, name: str, suffix: Literal["/videos"] | None = None
+    ) -> Response:
         if is_channel_id(name):
-            return await self.get_html(f"/channel/{name}")
+            return await self.get_html(f"/channel/{name}{suffix or ''}")
         if is_user(name):
-            return await self.get_html(f"/{name}")
+            return await self.get_html(f"/{name}{suffix or ''}")
         raise ValueError(f"Cannot find homepage for: {name}")
-
-
-@dataclass
-class YoutubeRssApi(AsyncRapidApi):
-    def __post_init__(self):
-        self.client.base_url = BASE_URL
-
-    @get(CHANNEL_RSS_URL, response_class=Feed)
-    async def get_channel_rss(self, channel_id: Annotated[str, Path()]): ...
-
-    @get(PLAYLIST_RSS_URL, response_class=Feed)
-    async def get_playlist_rss(self, playlist_id: Annotated[str, Path()]): ...
diff --git a/yourss/youtube/metadata.py b/yourss/youtube/metadata.py
deleted file mode 100644
index 397e0b6..0000000
--- a/yourss/youtube/metadata.py
+++ /dev/null
@@ -1,131 +0,0 @@
-import json
-import re
-from collections import UserDict
-from dataclasses import dataclass
-from functools import cached_property
-from typing import Any, Dict, Iterator, Literal, Self
-from urllib.parse import ParseResult, urlparse
-
-from bs4 import BeautifulSoup
-from httpx import Response
-
-from yourss.jsonutils import json_first, json_iter
-
-from .utils import ALLOWED_HOSTS, html_get_metadata, is_channel_id
-
-YTCFG_PATTERN = r"ytcfg\.set\((?P<json>(?:\"[^\"]*\"|'[^']*'|[^()])*)\)"
-YTINITIALDATA_PATTERN = r"ytInitialData = (?P<json>{.*?});"
-
-
-class YoutubeMetadata(UserDict[str, str]):
-    @classmethod
-    def from_response(cls, resp: Response) -> Self:
-        resp.raise_for_status()
-        assert resp.headers.get("content-type", "").startswith("text/html")
-        return cls(html_get_metadata(resp.text))
-
-    @property
-    def title(self) -> str:
-        return self["og:title"]
-
-    @property
-    def avatar_url(self) -> str | None:
-        return self.get("og:image")
-
-    @property
-    def url(self) -> ParseResult:
-        home_url = self["og:url"]
-        out = urlparse(home_url)
-        assert out.hostname in ALLOWED_HOSTS, f"Not a valid youtube url: {home_url}"
-        return out
-
-    @property
-    def channel_id(self) -> str:
-        last_segment = self.url.path.split("/")[-1]
-        assert is_channel_id(last_segment), f"Invalid channel_id: {last_segment}"
-        return last_segment
-
-
-@dataclass
-class VideoDescription:
-    video_id: str
-    title: str
-
-
-class VideoData(UserDict):
-    @classmethod
-    def from_json(cls, text: str) -> Self:
-        return cls(json.loads(text))
-
-    def iter_videos(
-        self, selector: Literal["videoRenderer", "reelItemRenderer"] = "videoRenderer"
-    ) -> Iterator[VideoDescription]:
-        for item in json_iter(f"$..{selector}", self.data):
-            yield VideoDescription(
-                video_id=json_first("$.videoId", item, str),
-                title=json_first("$.title.runs[0].text", item, str),
-            )
-
-    @property
-    def continuation_token(self) -> str | None:
-        return next(json_iter("$..continuationCommand.token", self.data, str), None)
-
-    @property
-    def click_tracking_params(self) -> str:
-        return json_first("$..clickTrackingParams", self.data, str)
-
-
-@dataclass
-class YoutubeWebPage:
-    response: Response
-
-    def __post_init__(self):
-        self.response.raise_for_status()
-
-    @cached_property
-    def soup(self) -> BeautifulSoup:
-        return BeautifulSoup(self.response.text, features="html.parser")
-
-    @cached_property
-    def metadata(self) -> Dict[str, str]:
-        return html_get_metadata(self.response.text)
-
-    @property
-    def metadata_title(self) -> str:
-        return self.metadata["og:title"]
-
-    @property
-    def metadata_avatar_url(self) -> str | None:
-        return self.metadata.get("og:image")
-
-    @property
-    def metadata_url(self) -> ParseResult:
-        home_url = self.metadata["og:url"]
-        out = urlparse(home_url)
-        assert out.hostname in ALLOWED_HOSTS, f"Not a valid youtube url: {home_url}"
-        return out
-
-    @property
-    def metadata_channel_id(self) -> str:
-        last_segment = self.metadata_url.path.split("/")[-1]
-        assert is_channel_id(last_segment), f"Invalid channel_id: {last_segment}"
-        return last_segment
-
-    def iter_scripts(self) -> Iterator[str]:
-        for script in self.soup.find_all("script"):
-            if script.string is not None:
-                yield script.string
-
-    def find_initial_video_data(self) -> VideoData | None:
-        for script in self.iter_scripts():
-            if (m := re.search(YTINITIALDATA_PATTERN, script, re.DOTALL)) is not None:
-                return VideoData.from_json(m.group("json"))
-
-    def find_client_data(self) -> Dict[str, Any] | None:
-        for script in self.iter_scripts():
-            if (
-                "INNERTUBE_CONTEXT" in script
-                and (m := re.search(YTCFG_PATTERN, script, re.DOTALL)) is not None
-            ):
-                payload = json.loads(m.group("json"))
-                return json_first("$.INNERTUBE_CONTEXT.client", payload)
diff --git a/yourss/youtube/model.py b/yourss/youtube/model.py
new file mode 100644
index 0000000..32c9bd4
--- /dev/null
+++ b/yourss/youtube/model.py
@@ -0,0 +1,66 @@
+import json
+from collections import UserDict
+from dataclasses import dataclass
+from typing import Any, Dict, Iterator, Literal, Self
+from urllib.parse import urlparse
+
+from .utils import is_channel_id, json_first, json_iter
+
+ALLOWED_HOSTS = ["consent.youtube.com", "www.youtube.com", "youtube.com", "youtu.be"]
+
+
+class YoutubeMetadata(UserDict[str, str]):
+    @property
+    def title(self) -> str:
+        return self["og:title"]
+
+    @property
+    def avatar_url(self) -> str | None:
+        return self.get("og:image")
+
+    @property
+    def url(self) -> str:
+        return self["og:url"]
+
+    @property
+    def channel_id(self) -> str:
+        url = urlparse(self.url)
+        assert url.hostname in ALLOWED_HOSTS, f"Not a valid youtube url: {self.url}"
+        last_segment = url.path.split("/")[-1]
+        assert is_channel_id(last_segment), f"Invalid channel_id: {last_segment}"
+        return last_segment
+
+
+@dataclass
+class VideoDescription:
+    video_id: str
+    title: str
+    published: str
+
+    @classmethod
+    def from_json(cls, payload: Dict[str, Any]) -> Self:
+        return cls(
+            video_id=json_first("$.videoId", payload, str),
+            title=json_first("$.title.runs[0].text", payload, str),
+            published=json_first("$.publishedTimeText.simpleText", payload, str),
+        )
+
+
+class BrowseData(UserDict[str, Any]):
+    @classmethod
+    def from_json_string(cls, text: str) -> Self:
+        return cls(json.loads(text))
+
+    def iter_videos(
+        self, selector: Literal["videoRenderer", "reelItemRenderer"] = "videoRenderer"
+    ) -> Iterator[VideoDescription]:
+        for item in json_iter(f"$..{selector}", self.data):
+            yield VideoDescription.from_json(item)
+
+    @property
+    def continuation_token(self) -> str | None:
+        return next(json_iter("$..continuationCommand.token", self.data, str), None)
+
+    @property
+    def click_tracking_params(self) -> str:
+        return json_first("$..clickTrackingParams", self.data, str)
diff --git a/yourss/youtube/scrapper.py b/yourss/youtube/scrapper.py
index f214100..a7a7f3f 100644
--- a/yourss/youtube/scrapper.py
+++ b/yourss/youtube/scrapper.py
@@ -1,52 +1,107 @@
+import json
+import re
 from asyncio import sleep
-from dataclasses import dataclass
-from typing import AsyncIterator, List
+from dataclasses import dataclass, field
+from typing import Any, AsyncIterator, Dict, Iterator, List, Self
 
-from .client import YoutubeWebApi
-from .metadata import VideoData, VideoDescription, YoutubeWebPage
+from bs4 import BeautifulSoup
+from httpx import Response
+
+from .client import YoutubeApi
+from .model import (
+    BrowseData,
+    VideoDescription,
+    YoutubeMetadata,
+)
+from .utils import json_first
+
+YTCFG_PATTERN = r"ytcfg\.set\((?P<json>(?:\"[^\"]*\"|'[^']*'|[^()])*)\)"
+YTINITIALDATA_PATTERN = r"ytInitialData = (?P<json>{.*?});"
+
+
+@dataclass
+class PageScrapper:
+    soup: BeautifulSoup
+
+    @classmethod
+    def from_response(cls, resp: Response) -> Self:
+        resp.raise_for_status()
+        return cls(soup=BeautifulSoup(resp.text, features="html.parser"))
+
+    def get_metadata(self) -> YoutubeMetadata:
+        return YoutubeMetadata(
+            {
+                m["property"]: m.get("content")
+                for m in self.soup.find_all("meta")
+                if "property" in m.attrs
+            }
+        )
+
+    def iter_scripts(self) -> Iterator[str]:
+        for script in self.soup.find_all("script"):
+            if script.string is not None:
+                yield script.string
+
+    def find_browse_data(self) -> BrowseData | None:
+        for script in self.iter_scripts():
+            if (m := re.search(YTINITIALDATA_PATTERN, script, re.DOTALL)) is not None:
+                return BrowseData.from_json_string(m.group("json"))
+
+    def find_client_data(self) -> Dict[str, Any] | None:
+        for script in self.iter_scripts():
+            if (
+                "INNERTUBE_CONTEXT" in script
+                and (m := re.search(YTCFG_PATTERN, script, re.DOTALL)) is not None
+            ):
+                payload = json.loads(m.group("json"))
+                return json_first("$.INNERTUBE_CONTEXT.client", payload)
 
 
 @dataclass
 class VideoScrapper:
-    youtube_api: YoutubeWebApi
+    youtube_api: YoutubeApi = field(default_factory=YoutubeApi)
 
     async def iter_videos(
-        self, channel_id: str, *, shorts: bool = False, delay: float = 0
+        self, channel: str, *, delay: float = 0
     ) -> AsyncIterator[List[VideoDescription]]:
-        resp = await self.youtube_api.get_html(
-            f"https://www.youtube.com/channel/{channel_id}/{'videos' if not shorts else 'shorts'}"
+        homepage = PageScrapper.from_response(
+            await self.youtube_api.get_homepage(channel, suffix="/videos")
         )
-        first_page = YoutubeWebPage(resp)
-        assert (client_data := first_page.find_client_data()) is not None
-        assert (video_data := first_page.find_initial_video_data()) is not None
+        assert (client_data := homepage.find_client_data()) is not None
+        assert (browse_data := homepage.find_browse_data()) is not None
         while True:
-            videos = list(
-                video_data.iter_videos(
-                    selector="videoRenderer" if not shorts else "reelItemRenderer"
-                )
-            )
+            videos = list(browse_data.iter_videos())
             if len(videos) > 0:
                 # yield all videos from the page
                 yield videos
             else:
                 # could not find any video
                 break
-            if video_data.continuation_token is None:
+            if browse_data.continuation_token is None:
                 # no continuation token, stop
                 break
             # get next page using json api
             if delay > 0:
                 await sleep(delay)
-            video_data = VideoData(
-                await self.youtube_api.api_browse(
-                    {
-                        "context": {
-                            "clickTracking": {
-                                "clickTrackingParams": video_data.click_tracking_params
-                            },
-                            "client": client_data,
-                        },
-                        "continuation": video_data.continuation_token,
-                    }
-                )
+            browse_data = await self.get_next_page(
+                client_data,
+                browse_data.click_tracking_params,
+                browse_data.continuation_token,
             )
+
+    async def get_next_page(
+        self,
+        client_data: Dict[str, Any],
+        click_tracking_params: str,
+        continuation_token: str,
+    ) -> BrowseData:
+        resp = await self.youtube_api.api_browse(
+            {
+                "context": {
+                    "clickTracking": {"clickTrackingParams": click_tracking_params},
+                    "client": client_data,
+                },
+                "continuation": continuation_token,
+            }
+        )
+        return BrowseData(resp)
diff --git a/yourss/youtube/utils.py b/yourss/youtube/utils.py
index 0ab98ea..bd8c1dc 100644
--- a/yourss/youtube/utils.py
+++ b/yourss/youtube/utils.py
@@ -1,13 +1,9 @@
 import re
-from typing import Dict
+from typing import Dict, Iterator, Type, TypeVar
 
-from bs4 import BeautifulSoup
+from jsonpath_ng import parse
 
-ALLOWED_HOSTS = ["consent.youtube.com", "www.youtube.com", "youtube.com", "youtu.be"]
-
-MOZILLA_USER_AGENT = (
-    "Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/117.0"
-)
+T = TypeVar("T")
 
 CHANNEL_PATTERN = r"^UC[\w-]{22}$"
 PLAYLIST_PATTERN = r"^PL[\w-]{32}$"
@@ -35,20 +31,12 @@ def is_user(text: str) -> bool:
     return bool(re.fullmatch(USER_PATTERN, text, flags=re.IGNORECASE))
 
 
-def bs_parse(html_text: str) -> BeautifulSoup:
-    """
-    Parses the given HTML text and returns a BeautifulSoup object.
-    """
-    return BeautifulSoup(html_text, features="html.parser")
+def json_iter(path: str, payload: Dict, cls: Type[T] | None = None) -> Iterator[T]:
+    for match in parse(path).find(payload):
+        out = match.value
+        if out is not None and (cls is None or isinstance(out, cls)):
+            yield out
 
 
-def html_get_metadata(html_text: str) -> Dict[str, str]:
-    """
-    Find all meta properties from given html page
-    """
-    soup = bs_parse(html_text)
-    return {
-        m["property"]: m.get("content")
-        for m in soup.find_all("meta")
-        if "property" in m.attrs
-    }
+def json_first(path: str, payload: Dict, cls: Type[T] | None = None) -> T:
+    return next(json_iter(path, payload, cls=cls))