@edwinsf@sfba.social said: Isn't the API du jour to make them forward and backward compatible to avoid version skew... I know that's not true at G Thread
Drake said: so much of what we struggle with in software development boils down to communication and a lack of common vocabulary we need more definition of terms like this to help bridge the gap and build awareness Thread
Hugo Dias said: It’s nice to find a good name for something you’ve been doing for years! These are real-world challenges that you, as a developer, need to deal with frequently. Great article, by the way 👌
Przemek Smyrdek said: If you're wondering how it's like to work on larger distributed systems, here's a great article about common issues with versioning:
Maciek Pekala said: We've implemented this for Pleo's tRPC+Lambda based Backend-for-Frontend a while back. Good to see this problem solved by a platform like Vercel and good to learn it has a proper name 😅
Sean Abraham said: Is that a typo in the graphic? Top right box says System B when it looks like it should be System A Thread
kemar said: "Version Skew" The mother of all backward compatible versions
chungwu said: So... If you were wondering, how can I know the React server action I'm calling from the browser will still be there when the server gets updated... The answer is more fancy infrastructure 😔
Theo - t3.gg said: Huge ship with the potential to significantly change how we deploy code as an industry Thread
Dom Sip said: I remember that in the past, 404s and temp version mismatches had to be solved (and tested) using Service Worker and PWA complex logic in about 2-4 sprints. The solution is so elegant! Thanks @vercel and @cramforce
Darian Moody said: This is the kind of innovation that Heroku could never. Version Skew is a daily problem for any team releasing multiple times a day (as most of us web folk should be!) Thread
Sebastian Markbåge said: If you deploy frequently, your users might hit a server that's not backwards compatible with your client code. Vercel supports immutable deploys integrated with Skew Protection which lets you still have a Server that can serve stale Clients. Thread
Karan Ganesan said: the comments section is a neat implementation!!! Do you use Twitter APIs to search for mentions with link or some other way? Thread
Michael Flores said: Was rereading this today and got curious – do you have an opinion on estimations on the individual task level? Thread
Dan Buckland said: Had this sent my way (thanks @Bonnett89!) – the bit about deadlines really resonated: "Deadlines are great. You need to set a date or you don’t ship. Without the deadline you aren't going to have the scope-conversation that you need to have." 👈🏻 4 mins Thread
Matt Pocock said: "Deadlines really are low-cost organizational devices to align multiple teams to get stuff done together." YES
Michael Flores said: It's simple to say but powerful to remember that much of the time we find ourselves feeling like we aren't shipping, or we're shipping bad quality, comes down to either flawed planning or flawed execution. Btw I suspect "coonversation" was intended to be "conversation"? Thread
Michelle Bakels said: the error bars is new to me but makes sense. how do you record error bars with your estimates and is there an actual visualization you use for this? also do you estimate for both sides, delivering early and late or just late? Thread
Henrik Ossipoff said: Short but great article about how to ship faster and on time - especially enjoyed the part and reasoning about deadlines - worth a read!
Krishna said: This was a great and necessary read for me, at this point of time, the right time. I was wondering to consider a pivot in my project and now I think I should go ahead and do it!
Joakim Green said: Thank you Malte for sharing this. The Vercel setup with preview links is amazing for giving both instant and async feedback. Do you wait merging until MAVP is done, or how do you do on a practical level? We’re on a monorepo. Thread
Andy Ingram 🌀 said: I liked the bit on deadlines. Tho I think they have to be real deadlines rather than "my manager looks bad if we don't ship by this date", made up deadlines don't act as a real motivator. But the key is forcing functions -- something slightly uncomfortable to make stuff happen. Thread
Dimos Raptis said: Nice article, I think engineers can easily get into the trap of establishing viability based purely on technical aspects of a product, not actual user experience. The "actually viable" term resonated a lot!
Lakshya Thakur said: An insightful read ✨. It answers some of the stuff I asked in this tweet. How do you achieve the rest (asked in the tweet) at Vercel though ? I am ready for another blog post 🫡 Thread
Sriram Krishnan said: Loved the post ! The way I internalized it was - make an ambiguous problem tractable. My problem with perf/promo has always been around rewarding for complex solutions to problems than rewarding people who make a complex problem simple and solve it with ease
Thomas Steiner said: I find it particularly challenging to judge someone’s ability to strive in ambiguity in an interview situation. Sure, I can formulate the problem in an ambiguous way, but is the candidate asking clarification questions them striving in ambiguity, or simply them doing the obvious?
Tobie Langel said: This reminds me of @snowded’s Cynefin framework for handling complexity. It’s a much more actionable framework to deal with ambiguity (equivalent to Cynefin’s complex and chaotic domains) than a mere injunction to thrive in it: Thread
Sébastien Cevey said: Epic run with some long-lasting impact – congratulations! And thank you for the role you played in getting me into the Google zoo in the first place, even though we didn't end up getting to work together.
Thomas Steiner said: Thanks for making me leave my comfort zone and encouraging me to learn proper JavaScript while you were still my seat neighbor in the Hamburg office. I wouldn’t be where I’m today without you. Of course also congratulations on where you got, and all the best for the next step! 🎈 Thread
Vik said: Whoaa.. looking forward to what's next for you.
Satyajeet Salgar said: Whoa! Congratulations on an amazing set of accomplishments and contributions!
Yang Guo (郭扬） said: What an inspiring career. I'm looking forward to Malte's next steps.
Kris Kowal said: Malte, Jan, and Holger hosted in 2009, my first opportunity to speak at a conference, where I presented CommonJS on Saturday and Ryan presented Node.js on Sunday. Then he went to Google, built frameworks nearly everyone benefits from today, and was kind.
Jeremy Selier said: What a run! Missing from your post is the incredible impact you had on people like me. I remember fondly our 1st chat when I was considering Photos and coming to the US. I guess my secret idea to work again with you at G falls apart but I’m excited to see what’s next for you!! Thread
Character Combinator 🪡🧩 said: Congratulations! 🍾 Also, thanks for summing up that decade. An entertaining read. And relatable, even if you were at such an elite position. Very curious where you are headed next. Thread
Houssein Djirdeh said: Say it isn't so 😢 You'll be missed greatly Malte. Looking forward to hearing about whatever is next in store for you!
Kevin Dangoor said: Congrats, Malte! That's an amazing set of work you've done there!
Rob Palmer said: "Of all the code that I wrote, my favorite change was probably the introduction of SUPER_UNCOMPILED mode for JavaScript delivery during development." Everyone loves fast iteration times. I can understand why this was satisfying.
furf.wtf said: Epic run, @cramforce. You changed the game! Now it's time to open that lemonade stand by the bay. 😎🖼 Image
Saulo Santos said: Wow! I consider to be very lucky to have crossed paths with you. Learned a ton from you. Wish you all the best!!
Rob Palmer said: Enjoy the break! And good luck with whatever you do next 😉
Dion Almaer said: A legendary run mate. What an impact. Can't wait to see what's next :)
Vamsee Jasti said: What this post actually misses is that more than your technical strengths, your leadership to bring a team together to deliver something great is unlike anything I’ve seen at Google. (Pin for perf at your new role 😂). We’ll miss you out here. 🍀
Senthil P said: That is a big one. All the best for your future endeavors.
Addy Osmani said: You’ll be missed, Malte! Thanks for the many ideas you contributed that made the web platform better over the years. Good luck with what’s next :)
Jon Kuperman said: End of a freaking era. You've done so much incredible work and I hope you get some nice time off and find something amazing and fun to do next!
Gergely Orosz said: Whoa, 11 years!! Congrats, must have been a big decision. Best of luck on what's next!
Lalit said: I have similar experiences at some places and it's downhill death march projects. Do not set and chase fictitious deadlines.
kenneth said: Do you think that managing a deadline from a partner team should be considered different from your own team deadlines? Do you find them harder to push back on? I do. Thread
Vitaly Friedman 🇺🇦🏳️🌈 said: When compressing images, 80% JPEG quality isn't the same as 80% AVIF/WebP quality. JPEG quality 80 produces identical visual results like AVIF quality 64 and WebP quality 82. On AVIF, WebP Quality Settings by @cramforce:
Glenn Gabe said: New post from @cramforce: "If you are looking for ways to improve metrics like Largest Contentful Paint (LCP), then supporting modern image formats may be a quick way to make progress." Thread
Jon Kuperman said: I tried to read your article but scrolling up and down and watching the yellow bar move is too fun Thread
Dmitry Pokidov said: Great article! What we found working really well @pixboost is to use different quality settings for different sizes. Meaning of its a small thumbnail then you'll see less artifacts and you can gomorr aggressive. Its opposite with a high quality zoom in or hero banners. Thread
Andrea Verlicchi said: Nice article and tool. It would be even better to add to the test one image with black text on red background, since that is where JPEG sucks the most, and see how AVIF and WEBP behave at different qualities.
Andy Davies said: My view is give the problem to your CDN (Akamai / Cloudflare / Fastly) or a specialist image service (Cloudinary, Imigix etc.) Thread
CSS Basics said: More than you ever wanted to know about font loading on the web: "Using font-display: optional together with self-hosting the #CSS for your web fonts gets you in really good shape with respect to LCP and CLS." #performance🖼 Image
Phil Wolstenholme said: Tools for reducing CLS from font loading via CSS: • • • Or subsetting to speed things up via smaller font files: • • Thread
Phil Wolstenholme said: 'perfect-ish-font-fallback' by @cramforce is an amazing and very easy-to-use tool for using the size-adjust CSS descriptor to make a fallback font's metrics match your primary font more closely, preventing CLS when a custom font is loaded and displayed: Thread
Andrey Savchenko said: Automatic font matching for minimal CLS tool trying this lowered CLS from 0.14 to 0.08 for me, browser support at 75% by now, seems worth throwing in if web fonts act up. :)
Shantanu Dutta said: An article about web font-loading techniques and concepts. #fontloading #webdev #frontenddev
Sebastian Markbåge said: New challenge for Font designers. Design new fonts that only have the exact same widths/kerning rules as existing system fonts. cc @rsms Thread
Silvestar Bistrović 🤘 said: 👉 More than you ever wanted to know about font loading on the web 💬 Malte Ubl describes several techniques to load fonts without affecting Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS). via @cramforce
Smashing Magazine said: Also, worth reading: More than you ever wanted to know about font loading on the web by @cramforce How to avoid layout shifts caused by web fonts by @simonhearne
Jérémie Baboukhian said: Why you should Use [font-display: optional] #fonts #webdev #FrontEndDevelopment #typography
robin said: This article is written by a true expert. Plenty of nuggets I didn't know in here, like that browsers no longer share caches between sites! Making file host CDNs () basically useless (if they were ever that useful).
Addy Osmani said:@KabosuNakamoto One way to approach a skeleton for loading=lazy images is to set their width/height then style the <img> with a background-image. See Thread
Paul Schreiner said: Maximally optimizing image loading for the web! Use of: * width & height * content-visibility: auto * Caching / Immutable (HTTP-Header) * loading="lazy" * decoding="async" ...and a few more tips in the article from @cramforce
Thisprogrammingthing said: "Maximally optimizing image loading for the web in 2021" by @cramforce Images in HTML continues to be a surprisingly "hard" problem.
jcletousey said: Displaying an image is easy, but it's harder making it responsive and loading it faster. So here is a great article on how to optimize image loading.
The whale said: Maximally optimizing image loading for the web in 2021 - In this post the author will outline 8 image loading optimization techniques to minimize both the bandwidth used... #Front #Image #Optimization by @cramforce
Phil Wolstenholme said:@maxiorel It's a little trick where the blurred version is set as a background image, so when the main image loads, the bg is hidden. It's based on this: I'll include a small bit of JS to remove the bg, for anyone who wants to use it with a transparent image. Thread
Simon Ihmig said: Hey @cramforce 👋 Many of the improvements in that version were based on your great blog post here: So thanks for that! 🙏 You asked for a ping when a tool implements all of it, so here it is! 😬 Thread
Simpledev said: Maximally optimizing image loading for the web in 2021 very nice article I didn't know the decoding attribute. Thank you @cramforce
Jon Kantner said: A helpful list of 8 image optimization techniques to minimize bandwidth and CPU usage
Brian Louis Ramirez said: Great idea to inline a blurry placeholder image to avoid a network request. I'll give it a try for LCP candidates, but I could imagine it won't really help for BTF images. Thread
Reza said: It helps a lot to save money and time for your web application
uption.net said: Maximally optimizing image loading for the web in 2021 via
Ana Travas said: Learn the different ways to do image optimization: - Responsive layout - Lazy rendering - AVIF - Load the right number of pixels - Caching - Blurry placeholder ... by @cramforce
Arnout Hellemans said: Awesome post by @cramforce on image optimizations options in 2021, must read imho for #seo and #webperf tweeps
Yohan J. Rodríguez said: #Wordpress #Automated | Maximally Optimizing Image Loading for the Web in 2021 <span style="font-size:12px; color:#f78787; text-decoration:none">()
MIND Development And Design said: Images are engaging #content, but they can also slow down your #website. Here are some tips for optimizing image loading on the web:
Wayne Kessler said: "Adding loading="lazy" to the img instructs the browser to only start fetching the image as it gets closer to the screen and is likely to actually be rendered."
Charles Meaden said: 8 handy image loading techniques to ensure that you're images load really fast
Lee Robinson said: 2️⃣ Lazy-load images as they enter the viewport The browser shouldn't load images a user can't see. To prevent page speed from being penalized, we should load images as they're scrolled into the viewport. Thread
Dan Denney said: Maximally optimizing image loading for the web in 2021 * Some awesome tips in here
Erika Vespa said: All you have to know about image loading optimization techniques for the web By @cramforce
Glenn Gabe said: I must have missed this post in late December. I recommend reading this... it's from @cramforce... he's working on the Page Experience Signal at Google, worked on Web Stories, AMP, and more. These techniques can help optimize for all aspects of Core Web Vitals. Enjoy :)
Jan Rajtoral™ said: .. eight image loading optimization techniques to minimize both the bandwidth used for loading images on the web and the CPU usage for image display ~ Maximally optimizing image loading for the web in 2021🖼 Image
Ben Myers 🦖 said: There is a whole *world* of image optimization I just don't know yet. Thread
Digitalworx said: Optimize image loading. Some great tips. #webdesign #webdev
Victor Ribero 🧘🏼♂️ said: Learn the different ways to do image optimization to have a great - Responsive layout - Lazy rendering - AVIF - Load the right number of pixels - Caching - Blurry placeholder - Etc
JD from DanylkoWeb said: ☕ *Morning Coffee Link* -- Maximally optimizing image loading for the web in 2021 -🖼 Image
Chris Heilmann said: 👉🏻 “Maximally optimizing image loading for the web in 2021” 🔗 That's a lot of options. By @cramforce
James said: A very interesting article by @cramforce (brought to my attention via @css newsletter) about the current state of optimising images on the web.
XWP said: Images take up a huge chunk of space on your website, and can ruin your performance. This comprehensive guide will help you optimize your images and keep your site running smoothly. Via @cramforce. Thread
Paul Applegate said: I don't understand it all, but I am following enough smart people on Twitter to soak up some knowledge. Probably. Maybe. Hopefully.
ScaleDynamics Dev 💻✨ said: Maximally optimizing image loading for the web in 2021 by @cramforce Read it here 👉 #webperf #webperformance #webdev #webdevelopment #javascript #developer #frontend🖼 Image
Mattia Astorino said: "Just add an image here, they said..." Handling images for modern web is something not easy. This is a good overview about how to do it now.
Sara Soueidan said: Maximally optimizing image loading for the web in 2021 by @cramforce Loads of great #performance tips in there, some I didn’t know of before (like the `decoding` attribute 😯) Thread
Lucio Martinez said: Powerful list of optimisations and possible improvements at the time of rendering an image in web 🚀
Mike Gifford said: has some great ideas for speeding up web pages. For other ideas worth checking out @SustainableUX & also signing up for @eatwholegrain's #CuriouslyGreen newsletter. I don't think I'd run across #srcsets before.
Phil Booth said: My, my - how far we've come since the day in 1993 when @pmarca first proposed the <img> tag! "Maximally optimizing #image loading for the web in 2021": HT @owenblacker __ *Some history: And the actual e-mail:🖼 Image
Tim Finin said: It's a good time of the year to remember our poor machines. Malte Ubl (@cramforce) describes 8 image loading optimization techniques (some new for 2021) to minimize the bandwidth used for loading images on the Web and CPU usage for image display.
Anatol Merezhanyi said: "Maximally optimizing image loading for the web in 2021" by @cramforce shares 8 practical techniques for optimizing image loading and decoding (explained as an annotated #HTML example) #design #FrontEnd #webdev
Roberto De Santis said: Top story: Maximally optimizing image loading for the web in 2021 , see more
SDS Labs said: Top story: Maximally optimizing image loading for the web in 2021 , see more
Kevin Marks said: Wow that's a lot of ceremony around images. I do like that some of them are becoming part of the browser default, but hardcoding pixel widths seems a shame. Thread
For Web said: Maximally optimizing image loading for the web in 2021. Malte Ubl shares 8 image loading optimization techniques to minimize both the bandwidth used for loading images and the CPU usage for image display →🖼 Image
Andrey Markeev said: Good to know. Tells something about the state of web images 😱 I mean, why the heck should it be SO complex to add an image to a website?! 🙄
webmonkey 🦄 said: A great explanation on image optimization for the web 💯
Dave Guarino said: Enjoying playing around with this @eleven_ty template from @cramforce for a simple blog that bakes in a ton of great defaults for performance and accessibility.
Thomas Allmer said:@jaffathecake I'm wondering how it compares to an html inline preview image. Sort of like <img style="background: data:image/svg+xml; ..." onload="remove background" src="url/to/img.avif"> Not needing to start downloading any image - but yes it needs a "build" setup. Thread
Addy Osmani said:@justinschuh My personal site is exactly this setup :) For newer projects, I recommend @eleven_ty + @cramforce's . Netlify or Vercel hosting are a plus if you want server-side analytics, CI, staged PRs etc. Thread
Nick Lewis said: this looks really interesting would be great to try it out
Addy Osmani said:@stephenaugustus@bitandbang I recommend @eleven_ty for anyone that needs a good static blog stack in 2021. It's fast (builds, default templates), extensible and 'just' JavaScript. Also has a good community of templates (e.g by @cramforce) you can start using in a click. Thread
jimakker said: eleventy-high-performance-blog | A high performance blog template for the 11ty static site generator. |
Stephen Brown-Bourne said:@keithkurson I don't know about *have* to have, but this setup is pretty sweet and has a lot of great things in it. Could be good for some inspiration. Thread
Shao | 少蒙 said: impressive list of performance best practices, and 11ty!
Steve Dunn said: A fantastic 11ty template! Thank you for sharing
griffadev said:@cramforce The image optimisation on is awesome, put into my existing blog, thanks! The plugin `img-dim` can almost be dropped into any project, unless custom dist folder (e.g. dist not _site). Have you considered this as a standalone plugin on npm? Thread
Hackerspace Mumbai said: The blog is based on @cramforce's awesome @eleven_ty template We ♥️ it bcos: ⚡ Speed . @____lighthouse 💯 🖼️ Image optimization baked in. 🔏 CSP security Most importantly 👇 🔬 Unit tests => missing from most blog templates and is a massive timesaver Thread
Chris Heilmann said: 👉🏻 “A starter repository for building a blog with the Eleventy static site generator implementing a wide range of performance best practices.” 🔗
Response Times said: Top story: GitHub - google/eleventy-high-performance-blog: A high performance blog template for the 11ty static site generator. , see more
Vamsee Jasti said: Might have to steal this! Is it expected that 'use this template' leads to a 404: Thread
CodeRelease.io said: Featured Repo: google/eleventy-high-performance-blog A high performance blog template for the 11ty static site generator.
htsh_tsyk said: htsh-tsyk starred google/eleventy-high-performance-blog on Github
Geshan Manandhar said:@KarlLHughes@Medium@eleven_ty is the simplest and fat free blogging software out there. It is not buzzword heavy but packs a punch. Check this repo under google - all100s on lighthouse. Don't know of another blog software that can do it easily :)
JavaScript1000 said: eleventy-high-performance-blog — A high performance blog template for the 11ty static site generator.
Pablo Lara H said: Eleventy high performance blog - A high performance blog template for the 11ty static site generator by Malte Ubl @cramforce at @GoogleOSS #eleventy #11ty #webdev🖼 Image
Awais said: ✍️ Well, this is fantastic. A free high-performance 11ty Blog template by Google mostly @cramforce, @mathias, and of course @zachleat. Lots of interesting web perf practices in the code — that's all FOSS (Free & Open Source Software). Have at it. Thread
Chris Johnson said: If you use 11ty or are interested on jumping on board with the best static site generator out there, then you have to check out this template. 🔥🔥🔥 Thread
Maximiliano Firtman said: This is great! I've tried to implement some of these features. I managed to succeed with some of these tasks and failed with many others so I'm glad @cramforce worked on a template to get started with a high performance static generated blog!
Tom Larkworthy said:@smtology So u want a design doc e.g. and you are struggling with granularity in the technical section. My opinion is document the API hosts and permissions required (not code, not URLs). Follow the execution against user journeys and highlight any state storage. Thread
rmz said:@georgebernhard@pati_gallardo Finally, an excellent systems design technique is to write clear prose. is one template for doing this, but this is just one of a myriad of ways to help when writing. It doesn’t hurt using a template, but the clarity is the important part. N/N
Isuru said: Design Docs at Google by @cramforce Writing design docs is a practice I hope to start with my team too. This was a well-written guide on what goes into them.
Gergely Orosz said: A few examples: - Google: a writeup from @cramforce here - @canva: they have a few hundred engineers - @stedi: starting from when they had a few devs - Uber: starting when the company had a few dozen engineers. My writeup here: Thread
Nathaniel Morihara (MurphysDad) said: "As software engineers our job is not to produce code per se, but rather to solve problems. Unstructured text, like in the form of a design doc, may be the better tool for solving problems early in a project lifecycle..." -@cramforce Thread
Clay Walker said: I'm a strong believer in the value of design docs, and @cramforce has written some great guides on how they are written at Google Thread
Dan Kleiman said: Note, that non-goals aren’t negated goals like “The system shouldn’t crash”, but rather things that could reasonably be goals, but are explicitly chosen not to be goals.
Sebastian said: Technical design docs, RFCs or architectural decision records are super important for every organization. Otherwise you end up in loose ends and teams that can't take decisions on their own.
Suresh S Murthy said: A great place to start if you are standardizing on your company’s design doc templates.
Tony Vlachakis said: Unstructured text composed in a design document could be a useful tool before coding begins. @cramforce
Moisés Vargas said: Writing technical docs minimize risks of poor design, security issues, lack of knowledge base when writing lasting software. Why to embrace it in Software/Product Teams?. Good post about it
Saha said: The decision whether to write a design doc comes down to the core trade-off of deciding whether the benefits in organizational consensus around design, documentation, senior review, etc. outweigh the extra work of creating the doc.
Paul Oliver ⁕ said: Does your organization write design docs before embarking on changing your software? I've come to love design docs because they force me to think thoroughly through the problem and it gives me invaluable feedback.
Colton J. McCurdy said: > Unstructured text, like in the form of a design doc, may be the better tool for solving problems early in a project lifecycle, as it may be more concise and easier to comprehend, and communicates the problems and solutions at a higher level than code. Thread
Victor Lee said: I like the "How to draw an owl" image so much... And sometimes, I feel like the request is on step 0, "Please draw a bird for me", and even not telling me that it should be an owl. @cramforce
Ben Dixon said: The piece itself is about design docs but includes some great insights into how to think about planning in the context of planning and agile development
Sergiu Bodiu 🌏 said: Design docs 1. Early identification of design issues (cheap) 2. Achieving consensus around a design in the organization. 3. Ensuring consideration of cross-cutting concerns. 4. Acts as a summary artefact in the technical portfolio of the software and more
rolgalan said: Nice summary by @cramforce about the best points and benefits of Google's Design Docs. At Glovo we follow the same process, but called them Request For Comments as (Uber used to). I find it quite valuable and a great engineering practice. Thread
madewithlove said: A look at how design documents are structured at Google when tackling complex software problems
Tiago Vignatti said: "design docs fulfill the following functions in the software development lifecycle: - Early identification of design issues when making changes is still cheap. - Achieving consensus around a design in the organization... " Thread
Henry Robinson said: I know this did the rounds a short while ago, but what an excellent, concise and insightful write up of the benefits of design docs. Writing well is a superpower for engineers, and is a skill that reliably tracks with seniority IME.
julien lind said: A quick and nice read if you are thinking or have ever though about design documentation for your software!
Andrew Hansen said: A great breakdown of why design docs matter. Importantly, not all code needs one!
Bret Mogilefsky said: Terrific balance between the need for oversight and the need for agility.
Francisco Avila said: Scaling ideas is hard. I found helpful to see Design doc templates used by other engineers. A good one from Google (Design / Tech Spec / RFC)
Amir Salihefendić said: "As software engineers our job is not to produce code per se, but rather to solve problems. Unstructured text, like in the form of a design doc, may be the better tool for solving problems early in a project lifecycle…"— Applies also to design and product
Code Climate said: "Design docs are a great way to gain clarity and achieve consensus around solving the hardest problems in a software project." - @cramforce shares Google's design doc framework:
Ivan Velichko said: Probably the only right way to make major changes in big tech departments.
#Soapbox said: I'm constantly evolving our design docs and will certainly add this to my arsenal. >> Design Docs at Google
Tony Vlachakis said: I learned from the following people last week: @forgeofman @microwisdoms @btantheman @BeyondInvestor @pashabitz @richhickey @cramforce @HustleWithRoss 1/13 Thread ⬇️ Thread
Krishna Mehra said: A very useful reminder of the core purpose Design Doc serves in rigorous engineering cultures like that of @Cohesity (very much adapted from Google!) - something that's often lost in the process!
Scott said: The longer I work on loosely defined software projects, the more I like the idea of some soft of documentation.
Florian Pfisterer said: > When Google engineers get confronted with a system that they hadn’t previously touched, their first question often is “Where is the design doc?” 👉
Emil Rasmussen said: 1/ There is something about how @basecamp uses The Pitch () that resonates with me on how @googledevs uses Design Docs Thread
Gary J. Foreman said: Good overview of a lightweight process that can ultimately save a lot of time, or frustration for your future self!
Marvel said: "The decision whether to write a design doc comes down to the core trade-off of deciding whether the benefits in organizational consensus around design, documentation, senior review, etc. outweigh the extra work of creating the doc." by @cramforce
Nicola Zanon 🌏 ➡️ 📦 said: The design doc documents the high level implementation strategy and key design decisions with emphasis on the trade-offs that were considered during those decisions.
Daisuke Shimamoto said: A easy to read introduction to Design Docs. These points stood out for me. - They are informal - Earlier problems are easier to fix - Scaling knowledge across organization
Felipe Hlibco said: Design Docs are great tools often underutilized. It especially shines in complex projects with non-obvious trade-offs.
Bernie Goldbach said: If it looks out of place on screen, perhaps you need a Design Doc:
Fabien Townsend 🐌 said: Here is three resources about design doc in software that I find out helpful: - by @cramforce - by @GergelyOrosz - by @clemmihai
Christian Hartmann said: UX: Design Docs at Google by @cramforce – one of the key elements of Google's software engineering culture is the use of defining software designs through design docs »
Miguel Filipe said: Two cool articles: 1. debugging oncall incidents - 2. design docs
Dean Henrichsmeyer said: This is a very well articulated article on design documents - what is in them, why you have them, and when to use them. The one thing I would add is that in a distributed organization, they are even more critical. - Thread
Vijay Nagarajan said: It's said that, ' Thou shall not covet '. But I'll be honest, articles like these do fill me with envy - of my cloud neighbours 😇
Ruslan Fomkin said: In #timescale I have learned to write design docs as an important step of #developing new complex functionality. Here is nice description of writing design docs at
James Le said: One of the key elements of Google’s software engineering culture is the use of defining software designs through design docs. @cramforce
Sai said: Figuring out what/how to document technical design, and how detailed it should be, while creating #code has always been part of the evolution of a #SoftwareEngineer. #100DaysofCode #Developer Good article on Design docs at Google:
Kelly Smith said: "Besides the original documentation of a software design, design docs fulfill the following functions in the software development lifecycle: Early identification of design issues when making changes is still cheap." + more practical stuff for everyone.
Quality not innovation. said: A good description, but this works well only when the problem is well understood, otherwise you're better off beginning by taking some time to write a prototype in //experimental. Thread
Jordi Abad said: "The design doc documents the high level implementation strategy and key design decisions with emphasis on the trade-offs that were considered during those decisions." Design Docs at Google
顧客課題pickup電話ピクポンCEOのyobata said: Design Docs at GoogleOne of the key elements of Google's software engineering culture is the use of defining so…
Gergely Orosz said: A good overview of how software design docs are used and written at Google: . A recommended read. At Uber, we have a similar approach, previously called RFCs, now ERDs (Engineering Review Docs). Some interesting parts from the article: Thread
Brian Alexander Lee said: I love great design docs and loathe bad ones. This post does a good job, I think, for describing how to make design docs I love.
Jean-Marc Liotier said: Yes, choosing "agile" methods doesn't mean that writing proper design documents isn't useful anymore.
Jomel Imperio said: Concise and insightful overview of design docs at Google. I'm already filing this to share with the team -- and inspire us to keep improving our own documentation!
DwaynePhillips said: How the software engineers at Google write design documents. These are useful and used
Richard Seroter said: Where @cramforce explains "design docs at Google" by laying out the structure, and when you don't need to write one ... Thread
Senthil said: A neat pragmatic overview by @cramforce on how to approach design docs for software systems
Benedykt Dryl said: Lots of great thoughts regarding architecture, abstraction, and designing applications in general 🔥 Thread
Luca Restagno said: 4. Designing very large JavaScript application — by Malte Ubl 5. The Cost Of JavaScript — by Addy Osmani Thread
Chris Sargent said:@cramforce nice article! It's so true that being senior can essentially mean always making it easier for everyone else... (and catching confusing one liners from other 'senior' devs...)
Addy Osmani said: Designing very large (JavaScript) applications by @cramforce continues to be a highly recommended read for both junior & senior engineers. Thread
Luca Colonnello 🇮🇹🇬🇧 said:@ScriptedAlchemy It is actually also the hydration step itself, not so much the state (although big state means more KB, so it does have an impact). Universal apps are unfortunately bad for initial load. Here’s an article from Google Engineers explaining it better Thread
Kaho Cheung said:@rauchg Reminds me of this in depth article on how Google handles different types of search results.
Andrey Romanov said:@theKashey FYI, I suddenly discovered that Google also uses so called “sidecar” pattern to split rendering and client-side logic :–) (search for “Split logic and rendering”) Thread
Stacey Tay said: Great read on what to think about when designing JS apps > You want to get to a state where whatever the engineers on your team do, the most straightforward way is also the right way–so ... that they naturally do the right thing.
Shahriar Tajbakhsh said: “use empathy and think with your engineers on your team about how they will use your APIs and how they will use your abstractions. [...] Put together, empathy and experience is what enables you to choose the right abstractions for your application.” -
Justin Falcone said: I think the most difficult part would be figuring out the dependency inversion, e.g. replacing `import` with `enhance`, a la Thread
Deepak Kumar said: Designing (Very) Large JavaScript Applications A written version of a talk given by Google’s Malte Ubl at JSConf Australia that took a high-level look at modularity, lazy loading code -
Johnathan Hok said: Some great tidbits: Designing very large (JavaScript) applications -
JSConf.Asia said: What happens when you need to make very large applications with JS? A good write up on how to scale up ⬆️ from a Google dev!
Rae Liu said: "So, my warning to you is: If you want to be more successful than Google Plus, don’t have 800KB of JS in your base bundle." 🙊@iancmyers Thread
Gonzotech said: learning the art of design docs through this amazing meta piece made by @cramforce "design doc, a design doc"
Addy Osmani said:@adityavikasd Google's design doc templates aren't currently open source, but has a good overview of the key ideas that make a good one.
Guillermo Rauch said: "The document should thus be as short as possible and as long as necessary." A timeless piece by @cramforce on how to write a Design Document Thread
Adith Widya Pradipta 🍥 said: "Each layer of software engineering is deep enough to spend many many years in perfecting its craft and really hard problems require specialists." -
Brett said: “I’m a frontend engineer because I was really mad and really full of myself.” - @cramforce
Christoph Reinartz said: Oh yes the "What The F***?!?!" - moments. - Anecdotes about frontend and backend engineering
rolgalan said: There are some really important engineer skills, like debugging or reading other people code, that are not usually recognized and evaluated as they should.
wuweiweiwu said: Been diving into the rabbit hole of server & client rendering and found this article from @cramforce and 7 years later still feels largely relevant