# Calculation rules for Visual Views, and how can I find them？

**URL:** <https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808>\
**Category:** General\
**Tags:** api, nextjs\
**Created:** [November 22, 2024, 5:48am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808 "2024-11-22T05:48:53Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![radis](https://avatars.discourse-cdn.com/v4/letter/r/c4cdca/32.png) [@radis](https://forum.builder.io/u/radis)\
**Post date:** [November 22, 2024, 5:48am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/1 "2024-11-22T05:48:53Z")

</div>

![Screenshot 2024-11-22 at 13.35.26](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/8/8c03b24ed323227dc9a7a61ad193f3dbc19b0124.png)

Since the 20th, there has been a sudden surge in Visual Views (VV), and although I can see which page is affected, there are no API calls on that page, and only a few images are used. I want to understand what factors might be affecting VV. Using 1M VV as an example:

1. **Content API** : Does each call count as one VV?
2. **Image API** : Does using images uploaded via Builder count as one VV, regardless of image size? If image optimization is used on resources uploaded via Builder, does it count as two VVs?
3. **Track** : Does the built-in tracking of Builder also count as one VV?
4. What other factors might influence VV, and could you explain their calculation rules? The documentation is not detailed enough.

---

<div class="post-metadata">

**Author:** ![radis](https://avatars.discourse-cdn.com/v4/letter/r/c4cdca/32.png) [@radis](https://forum.builder.io/u/radis)\
**Post date:** [November 22, 2024, 9:57am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/2 "2024-11-22T09:57:36Z")

</div>

```auto
import { ImageProps } from 'next/image'
import { Image } from '@builder.io/sdk-react'
import { useMemo } from 'react'
import { parseUrl, stringify } from 'query-string'
import { omitEmptyValues } from '@/utils/index'

export default function BuilderImage(props: ImageProps & Iprops) {
  const { src, quality = 85, format = 'webp', imgWidth, imgHeight, fit, position, alt, ...rest } = props

  const imgUrl = useMemo(() => {
    if (typeof src === 'string' && src?.includes('cdn.builder.io')) {
      const { url } = parseUrl(src)
      const params = { quality, height: imgHeight, width: imgWidth, format, fit, position }
      const queryString = stringify(omitEmptyValues(params))
      return `${url}${queryString ? `?${queryString}` : ''}`
    }
    return src
  }, [src, quality, imgHeight, imgWidth, format, fit, position])

  return <Image {...rest} className="w-100" altText={alt || 'builder-image'} image={imgUrl} />
}

```

If I use the image component from Builder, will it cause an increase in Visual Views? If I use the image component from Next.js, will it not cause this issue?

---

<div class="post-metadata">

**Author:** ![radis](https://avatars.discourse-cdn.com/v4/letter/r/c4cdca/32.png) [@radis](https://forum.builder.io/u/radis)\
**Post date:** [November 24, 2024, 8:16am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/3 "2024-11-24T08:16:19Z")

</div>

![image](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/9/97b93b8be870c4e6100321a5609585cd7c6db7c0.png)

Does each call to the pixel API in the diagram increase the visual view (VV) count by 1?

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [November 25, 2024, 9:15am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/4 "2024-11-25T09:15:55Z")

</div>

Hello @radis,

Visual Views are tracked when you use a [Page](https://www.builder.io/c/docs/models-pages) or [Section](https://www.builder.io/c/docs/models-sections) model with Builder’s Visual CMS and integrate with [Builder’s SDKs](https://www.builder.io/c/docs/sdk-comparison), the [HTML API](https://www.builder.io/c/docs/html-api), or [Qwik API](https://www.builder.io/c/docs/qwik-api).

Visual Views are recorded when a tiny (1x1) hidden image, called a tracking pixel, is rendered upon someone visiting your site or app.

If a single Page contains multiple content entries from Builder — such as two symbols — Builder ensures that these pixels are only counted once to avoid double counting by using a cache period in which the pixel request is cached in the user’s browser.

In this way, multiple pixel requests on the same Page from different Builder content entries only result in one tracking pixel request.

Technically, this method can result in undercounting Visual Views if a site visitor is navigating pages very quickly, but in most cases, this technique yields an accurate representation of Visual Views.

> **[Understanding Visual Views (Pageviews) - Builder.io](https://www.builder.io/c/docs/visualviews)**
>
> Learn what Visual Views (also known as Pageviews) are, what counts toward your Visual Views, what doesn't, and how they are tracked.

> **[Understanding Usage - Builder.io](https://www.builder.io/c/docs/usage)**
>
> Builder is the only Visual Development Platform that offers an AI-powered design-to-code tool, a visual editor, and an enterprise CMS.

---

<div class="post-metadata">

**Author:** ![radis](https://avatars.discourse-cdn.com/v4/letter/r/c4cdca/32.png) [@radis](https://forum.builder.io/u/radis)\
**Post date:** [November 28, 2024, 10:53am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/6 "2024-11-28T10:53:26Z")

</div>

![Screenshot 2024-11-28 at 18.49.10](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/b/b74939ec16ff49bf60ac16eb188162efb4a34712.png)

`import { Image } from '@builder.io/sdk-react'`

Because I used the builder’s image in the project, I kept getting hydration error warnings. I found out that in the code, when the `Tag` is set to `img` , using `fetchPriority` causes the warning, so it should be changed to `fetchpriority` .

> <https://github.com/BuilderIO/builder/blob/bb4f83b13edb7b3465ba6fea0b1231d530c59337/packages/react/src/blocks/Image.tsx#L354>

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [November 28, 2024, 11:51am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/7 "2024-11-28T11:51:06Z")

</div>

Hello @radis,

Could you please confirm the SDK version you are using? Also, if you are using Next.js, can you specify whether it is version 13 or 14?

---

<div class="post-metadata">

**Author:** ![radis](https://avatars.discourse-cdn.com/v4/letter/r/c4cdca/32.png) [@radis](https://forum.builder.io/u/radis)\
**Post date:** [November 29, 2024, 7:11am UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/9 "2024-11-29T07:11:59Z")

</div>

“@builder.io/sdk-react”: “3.0.0”  
“next”: “14.2.12”,

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [December 10, 2024, 3:37pm UTC](https://forum.builder.io/t/calculation-rules-for-visual-views-and-how-can-i-find-them/6808/10 "2024-12-10T15:37:23Z")

</div>

Hello @radis,

Our team has looked into the issue you reported, and it appears to be related to the SDK. This problem should be resolved once you upgrade to React 19. Unfortunately, there isn’t a simple workaround for this issue at the moment. It’s important to note that this warning indicates that one specific Builder feature, the lazy loading of the Image Block, may not function as expected when using React 18 or earlier versions.

Best regards,