Analytics
Last updated: March 2026
Track visitor behavior, measure page performance, and understand your audience with the built-in analytics dashboard. Webooto provides real-time and historical data covering traffic sources, geography, devices, browsers, and per-page metrics - all without third-party scripts.
On this page
Analytics Dashboard
The Analytics dashboard is the central hub for understanding how visitors interact with your site. It is accessed through the Analytics workspace canvas, which combines a filter bar at the top with a comprehensive dashboard below. The default view shows data for the last 30 days, and all panels update automatically when you change filters or time periods.
The dashboard is organized into summary cards, a time-series traffic chart, a top-pages table, and breakdown panels for traffic sources, countries, devices, and browsers. A live visitors badge in the top-right corner shows the number of people currently on your site, refreshing every 10 seconds.
Each summary card displays a key metric alongside a percentage change compared to the previous period, so you can quickly spot upward or downward trends. The traffic chart plots daily page views and unique visitors as layered area curves, making it easy to identify spikes, seasonal patterns, or the impact of marketing campaigns.
| Summary card | What it shows |
|---|---|
| Total Visits | The total number of page views in the selected period, with percentage change vs. the previous period |
| Unique Visitors | The number of distinct visitors (by session), with percentage change vs. the previous period |
| Avg. Duration | The average time a visitor spends per session, displayed in seconds or minutes |
| Bounce Rate | The percentage of single-page sessions where the visitor left without further interaction |
Keep an eye on the live visitors badge during product launches or marketing campaigns to gauge real-time impact.
Visitor Tracking & Metrics
Webooto tracks visitors using a lightweight TrackingPixel component that is embedded on every published page. The tracking pixel records each page view by sending a beacon request to the analytics API. It captures the visitor path, session ID, referrer, and UTM parameters (utm_source, utm_medium, utm_campaign) when present in the URL.
Sessions are identified by a client-side session ID stored in localStorage. A session expires after 30 minutes of inactivity, at which point a new session ID is generated on the next visit. When the visitor navigates away or closes the tab, the pixel sends a duration beacon so the server can record how long the visitor spent on each page.
The tracking system respects the Do-Not-Track browser setting. If a visitor has enabled Do-Not-Track, no data is collected. The pixel uses navigator.sendBeacon for reliable delivery even during page unloads, falling back to a standard fetch request when sendBeacon is unavailable.
Page view recorded
When a page loads, the TrackingPixel sends a beacon with the session ID, path, page ID, referrer, and any UTM parameters to the /api/analytics/track endpoint.
Session managed
The session ID is stored in localStorage and refreshed on each page view. After 30 minutes of inactivity the session expires and a new one begins.
Duration captured
On page unload or navigation, a duration beacon is sent to /api/analytics/duration with the elapsed time in milliseconds.
Metrics aggregated
The backend aggregates raw page views into overview metrics: total visits, unique visitors, average duration, and bounce rate, comparing the current period against the previous one.
The page ID is resolved from a prop passed by the page renderer, or falls back to a meta tag (webooto-page-id) or a data-page-id attribute in the DOM.
Page Performance
The Top Pages panel ranks every page on your site by total views within the selected period. For each page, the dashboard displays the page name, URL slug, total views, unique visitors, and average session duration. This lets you identify your highest-traffic content and spot pages where visitors tend to stay longer.
The data is fetched from the /analytics/pages endpoint and supports all the same filters as the rest of the dashboard. You can narrow results to a specific country, traffic source, device type, or browser to understand which pages perform best for particular audience segments.
| Column | Description |
|---|---|
| Page | The page name and URL slug (e.g., Home / /) |
| Views | Total page views from all visitors in the selected period |
| Uniques | Number of distinct visitors who viewed this page |
| Avg Dur. | Average time spent on this page per session, formatted in seconds or minutes |
Combine the page performance data with traffic source filters to discover which marketing channels drive the most engagement on your key landing pages.
Traffic Sources & Geography
The dashboard breaks down your audience across four dimensions: traffic sources, countries, devices, and browsers. Each dimension is displayed in its own panel with counts and percentages, giving you a complete picture of who is visiting and how they arrive.
Traffic sources categorize visits as direct, organic, social, referral, or email. Each source shows the visit count and its percentage of total traffic, visualized with a colored progress bar. Country data displays visitor counts with flag icons and country names, ranked by volume. Device stats split traffic between desktop, mobile, and tablet. Browser stats show the distribution across Chrome, Firefox, Safari, Edge, Opera, and others.
| Dimension | Breakdowns provided |
|---|---|
| Traffic Sources | Direct, Organic, Social, Referral, Email - each with count and percentage |
| Countries | Country name and flag, visit count and percentage, ranked by volume (top 10) |
| Devices | Desktop, Mobile, Tablet - each with count and percentage |
| Browsers | Chrome, Firefox, Safari, Edge, Opera, Other - each with count and percentage |
Country names and flags are resolved from ISO country codes using a built-in mapping utility, so you see human-readable names rather than raw codes.
Advanced Filtering
The Analytics Filter Bar sits above the dashboard and lets you slice data across multiple dimensions simultaneously. It provides date preset buttons, custom date range inputs, and dropdown selectors for country, source, device, and browser. All filters are applied together, and the entire dashboard updates in real time.
Date presets include Today, 7 days, 30 days, 90 days, and 1 year. Selecting "Custom" reveals a pair of date inputs where you can specify an exact from/to range. The dimension dropdowns (country, source, device, browser) are populated dynamically from the current dataset, so you only see values that actually exist in your analytics data.
Active filters appear as removable badges below the filter bar. Each badge shows the filter value and can be dismissed individually, or you can use the "Clear all" button to reset every dimension at once. The filter state is maintained in the workspace canvas component and passed to every dashboard query, ensuring consistent results across all panels.
Select a time period
Click a date preset button (Today, 7d, 30d, 90d, 1y) or choose "Custom" and enter a specific from/to date range.
Apply dimension filters
Use the dropdown menus to filter by country, traffic source, device type, or browser. The dropdowns are populated with values from your actual analytics data.
Review active filters
Active filters appear as badges below the bar. Click the X on any badge to remove that filter, or click "Clear all" to reset.
Analyze filtered results
All dashboard panels - summary cards, traffic chart, top pages, sources, countries, devices, and browsers - update automatically to reflect the combined filters.
Applying very narrow filters (e.g., a single day combined with a rare browser) may result in limited data. Broaden the time period or remove filters to see more results.