diff options
| author | Mitja Felicijan <m@mitjafelicijan.com> | 2023-07-08 23:25:41 +0200 |
|---|---|---|
| committer | Mitja Felicijan <m@mitjafelicijan.com> | 2023-07-08 23:25:41 +0200 |
| commit | cd6644ea4ddc78597934ab0ef5ba50e3c3daa927 (patch) | |
| tree | 03de331a8db6386dfd6fa75155bfbcea6b4feaf3 /public/what-i-ve-learned-developing-ad-server.html | |
| parent | 84ed124529ffeee1590295b8de3a8faf51848680 (diff) | |
| download | mitjafelicijan.com-cd6644ea4ddc78597934ab0ef5ba50e3c3daa927.tar.gz | |
Moved to a simpler SSG
Diffstat (limited to 'public/what-i-ve-learned-developing-ad-server.html')
| -rwxr-xr-x | public/what-i-ve-learned-developing-ad-server.html | 126 |
1 files changed, 126 insertions, 0 deletions
diff --git a/public/what-i-ve-learned-developing-ad-server.html b/public/what-i-ve-learned-developing-ad-server.html new file mode 100755 index 0000000..44e8d61 --- /dev/null +++ b/public/what-i-ve-learned-developing-ad-server.html | |||
| @@ -0,0 +1,126 @@ | |||
| 1 | <!doctype html><html lang=en-us><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><link href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL69vf8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv76+/8LBwQkAAAAAAAAAAAAAAAC+vb3/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL+9vf/Bv78JAAAAAAAAAAAAAAAAu7q6/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC7ubr/vr29CAAAAAAAAAAAy8nJAZ6foP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnqGj/6GipAoAAAAAHLjU/xcXHf/BwsL/I8XY/yPK3v8XGiD/IbjL/yPF2f8XGiD/Fxkf/yLF2f8gnK3/Fxog/62ztv8fwNf/FRcd/x271v8mz93/GRsi/xkXHf8p097/GiIp/xobIv8p0t3/KdPe/xocIv8fYmr/KNPe/xoZH/8aHCL/J87c/xy81/8VFxz/IsPZ/8zS0/8XGiD/Ir/R/yPH2/8XGiD/Fxkf/yPH2/8dd4T/GBog/yPJ3f8jyNr/uru9/xcUGv8cudb/EhITDKi5vRKlvMP/RUpOERwcHRAdOj4QHTk8EBwdHRAdNTgQHTo/EBwcHRAcHB0QSGduEKW4vf+koqQfHzg+EBqz0ewSFRv7EyMr/xq51vsTERb7ExUb+xq41fsau9j7ExUb+xiPp/sZudb7ExUb+xMVG/sZuNX/GKvI/BIUGfMdvdn/IrfL/xcaIP8n1eb/J9Dh/xkcIf8ZGR7/J8/f/xxCSv8ZGyH/J9Dg/ybQ4P8ZHCL/FSQs/yPK3/8UExj/GE1b/ybS5P8ZGB7/Ghwj/ynW5P8p2Ob/Ghwi/yWrtv8p1eH/Ghwi/xocIv8p1uT/J8XT/xkcIv8m1un/Hb7d/xUYH/8hzOr/HtHu/xcaIf8XGB//I8vi/xgxOv8XGSD/I8rg/yPK4P8XGiD/GUFL/yPP6f8SERj/Fhkh/x3A4f8AAAAAJ2f9/ydr//8mZPH/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlYu38J2v//ydo/f8AAAAAAAAAAAd8/fkFqf//Iob8sAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMY39awWr//8FfP3/AAAAAAAAAAAFm/7/SfD//wR+/f8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOB/f9B7v//BaX+/wAAAAAAAAAAQ878SAyZ/v9n1v4KAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADu9v8DDJb+/z3N/XgAAAAA3/sAAN/7AADf+wAA3/sAAAAAAAAAAAAAAAAAAN/7AAAAAAAAAAAAAAAAAAAAAAAAj/EAAI/5AACP8QAA3/sAAA==" rel=icon type=image/x-icon><title>What I've learned developing ad server</title><meta name=description content="For the past year and half I have been developing native advertising server thatcontextually matches ads and displays them in different template forms onvariety of websites."><link rel=alternate type=application/rss+xml title="Mitja Felicijan's posts" href=https://mitjafelicijan.com/index.xml><link rel=alternate type=application/rss+xml title="Mitja Felicijan's notes" href=https://mitjafelicijan.com/notes.xml><style>body{padding:1rem;max-width:760px;background:#fff;font-family:times new roman,Times,serif;line-height:1.35rem}hr{margin-block-start:1.5rem}h1,h2,h3{line-height:initial}footer{margin-block-start:3rem}table{max-width:100%;border-collapse:separate;border-spacing:2px;border:1px solid #000;border-left:1px solid #999;border-top:1px solid #999}blockquote{font-style:italic}table thead{background:#eee}td,th{border:1px solid #000;padding:4px;border-right:1px solid #999;border-bottom:1px solid #999;text-align:left}pre{text-wrap:nowrap;overflow-x:auto;margin-block-start:1.5rem;margin-block-end:1.5rem;padding:.5rem 0;border-top:1px solid #000;border-bottom:1px solid #000}pre code{line-height:1.3em}pre,code,pre *,code *{font-family:monospace;font-size:initial!important}img,video,audio{max-width:100%}header{display:flex;flex-direction:row;gap:3rem}nav{display:flex;gap:.75rem}.pstatus-orange{background:gold}.pstatus-green{background:#9acd32}.pstatus-red{background:#cd5c5c}@media only screen and (max-width:600px){header{flex-direction:column;gap:1rem}a{word-wrap:break-word}}</style><header><nav class=main><a href=/>Home</a> | ||
| 2 | <a href=https://git.mitjafelicijan.com/ target=_blank>Git</a> | ||
| 3 | <a href=https://files.mitjafelicijan.com/ target=_blank>Files</a> | ||
| 4 | <a href=/mitjafelicijan.pgp.pub.txt target=_blank>PGP</a> | ||
| 5 | <a href=/curriculum-vitae.html>CV</a> | ||
| 6 | <a href=/index.xml target=_blank>RSS</a></nav></header><main><div><h1>What I've learned developing ad server</h1><p>Apr 17, 2017<div><p>For the past year and half I have been developing native advertising server that | ||
| 7 | contextually matches ads and displays them in different template forms on | ||
| 8 | variety of websites. This project grew from serving thousands of ads per day to | ||
| 9 | millions.<p>The system is made from couple of core components:<ul><li>API for serving ads,<li>Utils - cronjobs and queue management tools,<li>Dashboard UI.</ul><p>Initial release was using <a href=https://www.mongodb.com/>MongoDB</a> for full-text | ||
| 10 | search but was later replaced by <a href=https://www.elastic.co/>Elasticsearch</a> for | ||
| 11 | better CPU utilization and better search performance. This provided us with many | ||
| 12 | amazing functionalities of <a href=https://www.elastic.co/>Elasticsearch</a>. You should | ||
| 13 | check it out if you do any search related operations.<p>Because the premise of the server is to provide native ad experience, they are | ||
| 14 | rendered on the client side via simple templating engine. This ensures that ads | ||
| 15 | can be displayed number of different ways based on the visual style of the | ||
| 16 | page. And this makes JavaScript client library quite complex.<p>So now that you know basic information about the product lets get into the | ||
| 17 | lessons we learned.<h2 id=aggregate-everything>Aggregate everything</h2><p>After beta version was released everything (impressions, clicks, etc) was | ||
| 18 | written in nanosecond resolution in the database. At that time we were using | ||
| 19 | <a href=https://www.postgresql.org/>PostgreSQL</a> and database quickly grew way above | ||
| 20 | 200GB in disk space. And that was problematic. Statistics took disturbingly long | ||
| 21 | time to aggregate. Also using indexes on stats table in database was no help | ||
| 22 | after we reached 500 million datapoints.<blockquote><p>There is a marketing product information and there is real life experience. | ||
| 23 | And the tend to be quite the opposite.</blockquote><p>This was the reason that now everything is aggregated on daily basis and this | ||
| 24 | data is then fed to Elastic in form of daily summary. With this we achieved we | ||
| 25 | can now track many more dimensions such as zone, channel and platform | ||
| 26 | information. And with this information we can now adapt occurrences of ads on | ||
| 27 | specific places more precisely.<p>We have also adapted <a href=https://redis.io/>Redis</a> as a full-time citizen in our | ||
| 28 | stack. Because Redis also stores information on a local disk we have some sort | ||
| 29 | of backup if server would accidentally suffer some failure.<p>All the real-time statistics for ad serving and redirecting is presented as | ||
| 30 | counters in Redis instance and daily extracted and pushed to Elastic.<h2 id=measure-everything>Measure everything</h2><p>The thing about software is that we really don't know how well it is performing | ||
| 31 | under load until such load is presented. When testing locally everything is fine | ||
| 32 | but when on production things tend to fall apart.<p>As a solution for this we are measuring everything we can. Function execution | ||
| 33 | time (by encapsulating functions with timers), server performance (cpu, memory, | ||
| 34 | disk, etc), Nginx and <a href=https://uwsgi-docs.readthedocs.io/>uWSGI</a> performance. | ||
| 35 | We sacrifice a bit of performance for the sake of this information. And we store | ||
| 36 | all this information for later analysis.<p><strong>Example of function execution time</strong><pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span>{ | ||
| 37 | </span></span><span style=display:flex><span> "get_final_filtered_ads": { | ||
| 38 | </span></span><span style=display:flex><span> "counter": 1931250, | ||
| 39 | </span></span><span style=display:flex><span> "avg": 0.0066143431, | ||
| 40 | </span></span><span style=display:flex><span> "elapsed": 12773.9500310003 | ||
| 41 | </span></span><span style=display:flex><span> }, | ||
| 42 | </span></span><span style=display:flex><span> "store_keywords_statistics": { | ||
| 43 | </span></span><span style=display:flex><span> "counter": 1931011, | ||
| 44 | </span></span><span style=display:flex><span> "avg": 0.0004605267, | ||
| 45 | </span></span><span style=display:flex><span> "elapsed": 889.2821669996 | ||
| 46 | </span></span><span style=display:flex><span> }, | ||
| 47 | </span></span><span style=display:flex><span> "match_by_context": { | ||
| 48 | </span></span><span style=display:flex><span> "counter": 1931011, | ||
| 49 | </span></span><span style=display:flex><span> "avg": 0.0055960716, | ||
| 50 | </span></span><span style=display:flex><span> "elapsed": 10806.0758889999 | ||
| 51 | </span></span><span style=display:flex><span> }, | ||
| 52 | </span></span><span style=display:flex><span> "match_by_high_performance": { | ||
| 53 | </span></span><span style=display:flex><span> "counter": 262, | ||
| 54 | </span></span><span style=display:flex><span> "avg": 0.0152770229, | ||
| 55 | </span></span><span style=display:flex><span> "elapsed": 4.00258 | ||
| 56 | </span></span><span style=display:flex><span> }, | ||
| 57 | </span></span><span style=display:flex><span> "store_impression_stats": { | ||
| 58 | </span></span><span style=display:flex><span> "counter": 1931250, | ||
| 59 | </span></span><span style=display:flex><span> "avg": 0.0006189991, | ||
| 60 | </span></span><span style=display:flex><span> "elapsed": 1195.4419869999 | ||
| 61 | </span></span><span style=display:flex><span> } | ||
| 62 | </span></span><span style=display:flex><span>} | ||
| 63 | </span></span></code></pre><p>We have also started profiling with <a href=https://pymotw.com/2/profile/>cProfile</a> | ||
| 64 | and then visualizing with <a href=http://kcachegrind.sourceforge.net/>KCachegrind</a>. | ||
| 65 | This provides much more detailed look into code execution.<h2 id=cache-control-is-your-friend>Cache control is your friend</h2><p>Because we use Javascript library for rendering ads we rely on this script | ||
| 66 | extensively and when in need we need to be able to change behavior of the script | ||
| 67 | quickly.<p>In our case we can not simply replace javascript url in html code. It usually | ||
| 68 | takes a day or two for the guys who maintain sites to change code or add | ||
| 69 | ?ver=xxx attribute. And this makes rapid deployment and testing very difficult | ||
| 70 | and time consuming. There is a limitation of how much you can test locally.<p>We are now in the process of integrating <a href=https://www.google.com/analytics/tag-manager/>Google Tag | ||
| 71 | Manager</a> but couple of websites | ||
| 72 | are developed on ASP.net platform that have some problems with tag manager. With | ||
| 73 | a solution below we are certain that we are serving latest version of the | ||
| 74 | script.<p>And it only takes one mistake and users have the script cached and in case of | ||
| 75 | caching it for 1 year you probably know where the problem is.<pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:green># nginx ➜ /etc/nginx/sites-available/default | ||
| 76 | </span></span></span><span style=display:flex><span><span style=color:green></span><span style=color:#00f>location</span> <span style=color:#a31515>/static/</span> { | ||
| 77 | </span></span><span style=display:flex><span> <span style=color:#00f>alias</span> <span style=color:#a31515>/path-to-static-content/</span>; | ||
| 78 | </span></span><span style=display:flex><span> <span style=color:#00f>autoindex</span> off; | ||
| 79 | </span></span><span style=display:flex><span> <span style=color:#00f>charset</span> <span style=color:#a31515>utf-8</span>; | ||
| 80 | </span></span><span style=display:flex><span> <span style=color:#00f>gzip</span> on; | ||
| 81 | </span></span><span style=display:flex><span> <span style=color:#00f>gzip_types</span> <span style=color:#a31515>text/plain</span> <span style=color:#a31515>application/javascript</span> <span style=color:#a31515>application/x-javascript</span> <span style=color:#a31515>text/javascript</span> <span style=color:#a31515>text/xml</span> <span style=color:#a31515>text/css</span>; | ||
| 82 | </span></span><span style=display:flex><span> <span style=color:#00f>location</span> ~<span style=color:#a31515>*</span> <span style=color:#a31515>\.(ico|gif|jpeg|jpg|png|woff|ttf|otf|svg|woff2|eot)</span>$ { | ||
| 83 | </span></span><span style=display:flex><span> <span style=color:#00f>expires</span> <span style=color:#a31515>1y</span>; | ||
| 84 | </span></span><span style=display:flex><span> <span style=color:#00f>add_header</span> <span style=color:#a31515>Pragma</span> <span style=color:#a31515>public</span>; | ||
| 85 | </span></span><span style=display:flex><span> <span style=color:#00f>add_header</span> <span style=color:#a31515>Cache-Control</span> <span style=color:#a31515>"public"</span>; | ||
| 86 | </span></span><span style=display:flex><span> } | ||
| 87 | </span></span><span style=display:flex><span> <span style=color:#00f>location</span> ~<span style=color:#a31515>*</span> <span style=color:#a31515>\.(css|js|txt)</span>$ { | ||
| 88 | </span></span><span style=display:flex><span> <span style=color:#00f>expires</span> <span style=color:#a31515>3600s</span>; | ||
| 89 | </span></span><span style=display:flex><span> <span style=color:#00f>add_header</span> <span style=color:#a31515>Pragma</span> <span style=color:#a31515>public</span>; | ||
| 90 | </span></span><span style=display:flex><span> <span style=color:#00f>add_header</span> <span style=color:#a31515>Cache-Control</span> <span style=color:#a31515>"public,</span> <span style=color:#a31515>must-revalidate"</span>; | ||
| 91 | </span></span><span style=display:flex><span> } | ||
| 92 | </span></span><span style=display:flex><span>} | ||
| 93 | </span></span></code></pre><p>Also be careful when redirecting to url in your python code. We noticed that if | ||
| 94 | we didn't precisely setup cache control and expire headers in response we didn't | ||
| 95 | get the request on the server and therefore couldn't measure clicks. So when | ||
| 96 | redirecting do as follows and there will be no problems.<pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:green># python ➜ bottlepy web micro-framework</span> | ||
| 97 | </span></span><span style=display:flex><span>response = bottle.HTTPResponse(status=302) | ||
| 98 | </span></span><span style=display:flex><span>response.set_header(<span style=color:#a31515>"Cache-Control"</span>, <span style=color:#a31515>"no-store, no-cache, must-revalidate"</span>) | ||
| 99 | </span></span><span style=display:flex><span>response.set_header(<span style=color:#a31515>"Expires"</span>, <span style=color:#a31515>"Thu, 01 Jan 1970 00:00:00 GMT"</span>) | ||
| 100 | </span></span><span style=display:flex><span>response.set_header(<span style=color:#a31515>"Location"</span>, url) | ||
| 101 | </span></span><span style=display:flex><span><span style=color:#00f>return</span> response | ||
| 102 | </span></span></code></pre><blockquote><p>Cache control in browsers is quite aggressive and you need to be precise to | ||
| 103 | avoid future problems. We learned that lesson the hard way.</blockquote><h2 id=learn-nginx>Learn NGINX</h2><p>When deciding on a web server we went with Nginx as a reverse proxy for our | ||
| 104 | applications. We adapted micro-service oriented architecture early in the | ||
| 105 | project to ensure when we scale we can easily add additional servers to our | ||
| 106 | cluster. And Nginx was crucial to perform load balancing and static content | ||
| 107 | delivery.<p>At first our config file was quite simple and later grew larger. After patching | ||
| 108 | and adding new settings I sat down and learned more about the guts of Nginx. | ||
| 109 | This proved to be very useful and we were able to squeeze much more out of our | ||
| 110 | setup. So I advise you to take your time and read through the | ||
| 111 | <a href=https://nginx.org/en/docs/>documentation</a>. This saved us a lot of headache. | ||
| 112 | Googling for solutions only goes so far.<h2 id=use-redismemcached>Use Redis/Memcached</h2><p>As explained above we are using caching basically for everything. It is the | ||
| 113 | corner stone of our services. At first we were very careful about the quantity | ||
| 114 | of things we stored in <a href=https://redis.io/>Redis</a>. But we later found out that | ||
| 115 | the memory footprint is very low even when storing large amount of data in it.<p>So we gradually increased our usage to caching whole HTML outputs of dashboard. | ||
| 116 | This improved our performance in order of magnitude. And by using native TTL | ||
| 117 | support this goes hand in hand with our needs.<p>The reason why we choose <a href=https://redis.io/>Redis</a> over | ||
| 118 | <a href=https://memcached.org/>Memcached</a> was the nature of scalability of Redis out | ||
| 119 | of the box. But all this can be achieved with Memcached.<h2 id=conclusion>Conclusion</h2><p>There are a lot more details that could have been written and every single topic | ||
| 120 | in here deserves it's own post but you probably got the idea about the problems | ||
| 121 | we faced.</div></div></main><footer><hr><div><h3>Want to comment or have something to add?</h3>You can write me an email at | ||
| 122 | <a href=mailto:m@mitjafelicijan.com>m@mitjafelicijan.com</a> or catch up | ||
| 123 | with me | ||
| 124 | <a href=https://telegram.me/mitjafelicijan target=_blank>on Telegram</a>.</div><hr><p>This website does not track you. Content is made available under | ||
| 125 | the <a href=https://creativecommons.org/licenses/by/4.0/ target=_blank rel=noreferrer>CC BY 4.0 license</a> unless specified | ||
| 126 | otherwise. Blog feed is available as <a href=/index.xml target=_blank>RSS feed</a>.</footer><script src=https://cdn.usefathom.com/script.js data-site=XHQARKXP defer></script> \ No newline at end of file | ||
