layout | title | head_title | description | pid | hide | isNavParent | isNavDropdown |
---|---|---|---|---|---|---|---|
page |
How it Works |
How it Works |
An overview of how header bidding with prebid.js works |
1 |
true |
true |
false |
At a high level, header bidding involves just a few steps:
-
The Prebid.js library fetches bids from various partners
-
Prebid.js passes information about those bids (including price) to the tag on page, which passes it to the ad server as query string parameters.
-
The ad server has line items targeting those parameters.
Note that the only additional latency introduced by header bidding comes during step #1. Fortunately this latency can be controlled by a timeout setting. Furthermore, Prebid.js sends bid requests asynchronously to avoid blocking page load.
For more information about how to set up header bidding with Prebid.js, see Getting Started.
The steps below describe how the process of header bidding with Prebid.js works in more detail (Each numbered step is shown in the diagram at the bottom of this page):
-
Prebid.js loads asynchronously in the page header and hooks into the ad tag on page to get the placement ID and size. It can also be used to set a timeout to delay loading the ad tag while the header auction occurs. If the header auction exceeds the timeout, the auction is skipped and the tag on page loads normally.
-
Prebid.js makes an auction request to each of the header bidding partners that you've configured.
-
Each partner holds its own internal auction.
-
Each partner returns bids to Prebid.js which include the creative payload and other information.
-
Prebid.js passes along bid information (including price) to the tag on page, which passes it to the ad server as a set of query string parameters. In the ad server, there are line items targeting those parameter.
-
The ad server evaluates all of the bids and chooses a winner. The tag on the page loads a creative from the winning bidder. Note that no additional latency is introduced by creatives from header bidding partners since their creative payloads were already fetched during step #4.
![Prebid Auction Diagram]({{ site.github.url }}/assets/images/prebid-auction.png)