<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Zac J.Q. Yap</title>
    <description>The latest articles on Forem by Zac J.Q. Yap (@zacyap).</description>
    <link>https://forem.com/zacyap</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F386319%2F8e8f7787-4688-452f-87f3-f4a774a83a5d.jpg</url>
      <title>Forem: Zac J.Q. Yap</title>
      <link>https://forem.com/zacyap</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/zacyap"/>
    <language>en</language>
    <item>
      <title>Reuse Data for Training During Upstream CPU Bottlenecks</title>
      <dc:creator>Zac J.Q. Yap</dc:creator>
      <pubDate>Tue, 26 May 2020 13:33:11 +0000</pubDate>
      <link>https://forem.com/zacyap/reuse-data-for-training-during-upstream-cpu-bottlenecks-4bdk</link>
      <guid>https://forem.com/zacyap/reuse-data-for-training-during-upstream-cpu-bottlenecks-4bdk</guid>
      <description>&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Ffd8k8Ma--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/v47onj6lhcz4glzo9r7g.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Ffd8k8Ma--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/v47onj6lhcz4glzo9r7g.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Upstream operations (eg. Disk I/O and data preprocessing) in the neural network training pipeline do not run on hardware accelerators.&lt;/p&gt;

&lt;p&gt;“Data echoing” reuses intermediate outputs from earlier pipeline stages when the training pipeline has an upstream bottleneck. This maximises hardware utilisation. The number of times data is reused is set as the echoing factor. The effectiveness of this approach challenges the idea that use of repeated data for SGD updates is useless or even harmful.&lt;/p&gt;

&lt;p&gt;Echoing can be done:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Before batching – data is repeated and shuffled at the training example level, increasing the likelihood that nearby batches will be different. This has the risk of duplicating examples within a batch.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;After batching&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Before augmentation – allows repeated data to be transformed differently, potentially making repeated data more akin to fresh data&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;After augmentation – other methods like dropout that add noise during the SGD update can make repeated data appear different&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Data echoing reduces the number of fresh examples required for training and the training time, without harming predictive performance (up to a upper bound on the echoing factor). There is also empirical evidence of data echoing performing better with larger batch sizes and more shuffling.&lt;/p&gt;

&lt;p&gt;Source paper: &lt;a href="https://arxiv.org/pdf/1907.05550.pdf"&gt;https://arxiv.org/pdf/1907.05550.pdf&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Liked this post? &lt;br&gt;
This summary first appeared in the &lt;a href="https://pragmaticcs.substack.com/welcome"&gt;Pragmatic CS newsletter&lt;/a&gt;. Subscribers got it first!&lt;/p&gt;

</description>
      <category>machinelearning</category>
      <category>datascience</category>
    </item>
    <item>
      <title>Interview With Alex Pareto from Brex – Scaling, Thundering Herd Problem, Dev Tools, Elixir and Functional Programming</title>
      <dc:creator>Zac J.Q. Yap</dc:creator>
      <pubDate>Mon, 18 May 2020 05:35:46 +0000</pubDate>
      <link>https://forem.com/zacyap/interview-with-alex-pareto-from-brex-scaling-thundering-herd-problem-dev-tools-elixir-and-functional-programming-486</link>
      <guid>https://forem.com/zacyap/interview-with-alex-pareto-from-brex-scaling-thundering-herd-problem-dev-tools-elixir-and-functional-programming-486</guid>
      <description>&lt;h2&gt;
  
  
  Alex is the former Head of Engineering at video-first e-commerce app NTWRK and co-founder of a YCombinator-backed startup. 
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Who are you and what’s your backstory?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Hey, I’m Alex! I work on engineering at Brex. We’re reinventing financial systems to help ambitious companies scale. I work on building out the Card product.&lt;/p&gt;

&lt;p&gt;Before Brex, I led the engineering team at NTWRK, a video first e-commerce app. NTWRK releases new goods in collaboration with popular brands and celebrities. During my time there we worked with Drake, Lebron James, Nike, and many others. We often dealt with interesting technical challenges around scaling and thundering herds.&lt;/p&gt;

&lt;p&gt;Earlier than NTWRK, I co-founded Demeanor.co, a Y Combinator backed startup. Demeanor was a platform for celebrities and internet creators to create custom merchandise. During my time at Demeanor, I focused a lot on how to build software in a way that let us iterate and ship quickly.&lt;/p&gt;

&lt;p&gt;In my past, I also have spent time working on software at Facebook and a few small startups.  Back at USC, I started a CS organization for making things with other students called Scope.&lt;/p&gt;

&lt;p&gt;I write (occasionally) at alexpareto.com, about my thoughts on software and startups.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;You mentioned scaling and thundering herds challenges back during your time at NTWRK. Can you talk us through how you dealt with it?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Definitely! At NTWRK every show is live. We sent a push notification to interested users just before the show starts and everyone watches the show concurrently. This means the traffic patterns are very spiky - traffic can increase by 100x in a matter of seconds. At that rate of increase autoscaling can't keep up.&lt;/p&gt;

&lt;p&gt;Addressing spiky traffic takes a few steps. The first is to cache liberally (preferably on the edge using a CDN like Cloudflare or Cloudfront). This helps ease the load on the servers and database quite a bit.&lt;/p&gt;

&lt;p&gt;A massive amount of users online concurrently means that every time the cache expires, a host of requests cascade onto the servers requesting the same data.&lt;/p&gt;

&lt;p&gt;All these requests hitting the database can cause a big slow down. The trick here is to note that all the requests are asking for the same data. So instead of letting all the requests cascade to the database to recalculate the same data thousands of times - the solution is to recalculate the data once and share it with all the requests.&lt;/p&gt;

&lt;p&gt;Redis works well for this - to ensure that only one request goes to the database when a complex query needs to be recalculated and that all other requests read the result from Redis.&lt;/p&gt;

&lt;p&gt;If you're interested, this article on &lt;a href="http://highscalability.com/strategy-break-memcache-dog-pile"&gt;High Scalability&lt;/a&gt; does a nice job describing various caching techniques and this &lt;a href="https://www.facebook.com/watch/?v=10153675295382200"&gt;video from Facebook&lt;/a&gt; does a nice job of describing the thundering herd problem.&lt;/p&gt;

&lt;p&gt;Editor’s Note: Alex also wrote an &lt;a href="https://alexpareto.com/scalability/systems/2020/02/03/scaling-100k.html"&gt;extremely helpful post for scaling stage-by-stage up to 100k users&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;You said that back at Demeanor you focused on building software in a way that lets you iterate and ship quickly. What’s the difference between that and the approach you have to take now, and the implications of the different approaches?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;There are a few different stages of companies, and at each stage shipping fast and iterating is important. With that said, there are different goals at different stages.&lt;/p&gt;

&lt;p&gt;An early stage, zero to one company like Demeanor is about iterating fast to find product market fit and make something people want. We sacrificed certain things like stability and broad feature sets to get something into people's hands quickly. For example - during the early stages of the company we had no staging environment, feature flags, or QA testing.&lt;/p&gt;

&lt;p&gt;Growth stage companies like NTWRK operate at a larger scale - both in users and engineers. Shipping fast is important, but so is stability and maintainability. This means having feature flags, interfaces for third party libraries, proper integration + unit testing, and other practices. I think these practices take a bit more time up front, but help teams ship faster once the team size grows. New engineers can onboard faster, people have confidence to ship changes, libraries can be swapped out fast, and new features can be added quickly.&lt;/p&gt;

&lt;p&gt;Different tools and techniques for different stages and goals!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What are you excited about right now in CS?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I’m really excited about the advancements in developer tooling made in recent years. There are some exciting companies in the space making it much easier to ship very scalable software. I’ve used both Vercel and Render in the past few months - they are a blast to work with.&lt;/p&gt;

&lt;p&gt;Advancements like these lower the barrier to entry for people to start or build something new. With less capital needed - and no need to learn the nuances of AWS or a linux box off the bat - we’ll start to see a lot more startups and products launch in the coming years.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What was the last thing you learned?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The most recent thing I’ve learned about is functional programming. We use Elixir at Brex which meant I had to break some old object-oriented instincts when I joined. Lots of the paradigms around object-oriented programming get thrown out the window with functional programming.&lt;/p&gt;

&lt;p&gt;The key thing to keep in mind is that functional programming is all about taking data and transforming it.&lt;br&gt;
If you’re interested, Elixir is a fantastic language to get started with functional programming. Programming Elixir by Dave Thomas is a great introduction to the language.&lt;/p&gt;

&lt;p&gt;Editor’s Note: Check out &lt;a href="https://medium.com/brexeng/why-brex-chose-elixir-fe1a4f313195"&gt;Why Brex Chose Elixir&lt;/a&gt; and also &lt;a href="https://blog.discord.com/scaling-elixir-f9b8e1e7c29b"&gt;How Discord Scaled Elixir to 5 million Concurrent Users&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For me, the quickest way to learn something is by doing (and deep work!). Reading a book like Programming Elixir is great for getting a background. After establishing a background, diving in and writing code  forces one to start thinking and solving problems in a "functional" way. I would encourage anyone interested to build a side project (even if it's for personal use) in a functional language like Elixir to get started with it.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Who inspires you as a software engineer? Why?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I’m a big fan of Cal Newport’s writing on deep work (he also happens to be a CS professor).&lt;/p&gt;

&lt;p&gt;Writing great software is a craft that requires intense focus.&lt;br&gt;
In his writing, Cal talks a lot about how to cut distractions to open up periods of time for this intense focus. He argues that these periods of time are where we'll do our best work.&lt;/p&gt;

&lt;p&gt;I've found this to be very true in practice - even outside of software engineering. Whether writing strategy plans or writing software, the way to do the task well is to set aside some time to focus on that and only that. I block out an hour or two each day to focus - and turn off Slack, messages, notifications, and e-mail for the whole block of time.&lt;/p&gt;

&lt;p&gt;Over time, I've noticed this is a common habit among many people I know to get more high quality work done faster. If you're interested, Deep Work by Cal Newport is a great place to start!&lt;/p&gt;

&lt;p&gt;--&lt;br&gt;
Liked this interview? Check out more interviews with CTOs and Tech Leads, along with actionable CS research and software engineering best practices at my newsletter: pragmaticcs.substack.com&lt;/p&gt;

</description>
      <category>elixir</category>
      <category>functional</category>
      <category>webperf</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Scaling your web app up to 100K users and beyond</title>
      <dc:creator>Zac J.Q. Yap</dc:creator>
      <pubDate>Sun, 17 May 2020 08:50:47 +0000</pubDate>
      <link>https://forem.com/zacyap/scaling-your-web-app-up-to-100k-users-and-beyond-3ii6</link>
      <guid>https://forem.com/zacyap/scaling-your-web-app-up-to-100k-users-and-beyond-3ii6</guid>
      <description>&lt;p&gt;&lt;a href="https://engineering.khanacademy.org/posts/handling-2x-traffic-in-a-week.htm"&gt;Khan Academy scaled to 2.5x their web traffic in a week&lt;/a&gt; by using serverless architecture and CDN caching of all static data. They also extensively cached common queries, user preferences and session data.&lt;/p&gt;

&lt;p&gt;You can also adopt a &lt;a href="https://blog.hartleybrody.com/scale-load/"&gt;bottleneck-centric approach to scaling&lt;/a&gt;, by checking your resource monitoring to identify the bottlenecks. It is usually the database first. But bottlenecks can be memory, CPU, Network I/O or Disk I/O. &lt;/p&gt;

&lt;p&gt;As a principle, make the web stack do less work for the most common requests . &lt;/p&gt;

&lt;p&gt;Some ideas:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Cache database queries&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Index the database&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Move session storage to an in-memory caching tool&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;HTML fragment caching&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Use queues and more workers&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Use HTTP caching headers&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Add a Content Delivery Network in front of a static file host&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Here's a &lt;a href="http://highscalability.com/blog/2016/1/11/a-beginners-guide-to-scaling-to-11-million-users-on-amazons.html"&gt;guide for scaling up to 11M users&lt;/a&gt;, stage by stage:&lt;/p&gt;

&lt;p&gt;Use vertical scaling early on but it has no failover or redundancy.&lt;br&gt;
At &amp;gt;1000: Add availability zones, load balancers, and slave database to RDS.&lt;/p&gt;

&lt;p&gt;At 10K-100Ks: Horizontal scaling of instances. Move static content to S3 and even some dynamic content to the Cloudfront CDN. Add more read replicas of the database to RDS. Shift session state off your web tier and store session state in ElasticCache or DynamoDB&lt;/p&gt;

&lt;p&gt;At &amp;gt;500K: Add automation tools and decouple infrastructure. Add monitoring, metrics and logging.&lt;/p&gt;

&lt;p&gt;At &amp;gt;10M: Use federation, sharding and explore other types of DBs&lt;/p&gt;

&lt;p&gt;--&lt;br&gt;
Found this helpful? I write a &lt;a href="https://pragmaticcs.substack.com/"&gt;weekly newsletter on actionable CS research and software engineering best practices&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Cheers,&lt;br&gt;
Zac&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>architecture</category>
      <category>devops</category>
      <category>aws</category>
    </item>
    <item>
      <title>Google's guide and chart for where to implement application logic and rendering</title>
      <dc:creator>Zac J.Q. Yap</dc:creator>
      <pubDate>Sat, 16 May 2020 15:40:33 +0000</pubDate>
      <link>https://forem.com/zacyap/where-to-implement-application-logic-and-rendering-3b82</link>
      <guid>https://forem.com/zacyap/where-to-implement-application-logic-and-rendering-3b82</guid>
      <description>&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--2SPer6pK--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/7l1j339bta3hn2ofhrge.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--2SPer6pK--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/7l1j339bta3hn2ofhrge.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
Source: &lt;a href="https://developers.google.com/web/updates/2019/02/rendering-on-the-web"&gt;https://developers.google.com/web/updates/2019/02/rendering-on-the-web&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Found this chart from a February 2019 Google Developer update which was very helpful for me in making architecture decisions and choosing frameworks to use (React frameworks like Next.js, Gatsby etc.) – instead of just going with the most heavily-marketed and hyped ones!&lt;/p&gt;

&lt;p&gt;Note the tradeoffs between performance, SEO and overhead costs. Personally though, I don't think the Time To First Byte (TTFB) performance measure they use is that significant a consideration to take into account.&lt;/p&gt;

&lt;p&gt;“Trisomorphic” rendering which was mentioned in the article, and not discussed as widely, seemed promising:&lt;br&gt;
Use streaming server rendering for initial/non-JS navigations. Then have your service worker take on rendering of HTML for navigations. This keeps cached components and templates up to date. Enables SPA-style navigations to render new views in the same session. Works best when you share the same templating and routing code between the server, client page, and service worker. &lt;/p&gt;

&lt;p&gt;If you are doing client-side rendering, make sure you implement aggressive code splitting and lazy-load Javascript!&lt;/p&gt;

&lt;p&gt;--&lt;br&gt;
If you found this helpful, I run a newsletter featuring more of such content at: &lt;a href="https://pragmaticcs.substack.com/"&gt;https://pragmaticcs.substack.com/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Cheers,&lt;br&gt;
Zac&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>react</category>
    </item>
  </channel>
</rss>
