#DevDiscuss Archive

Tuesday April 25, 2017
9:00 PM EDT
  • ThePracticalDev Apr 25 @ 9:02 PM EDT
    Time for the #DevDiscuss Twitter chat! Tonight's topic is WEB PERFORMANCE
  • ThePracticalDev Apr 25 @ 9:03 PM EDT
    Rules: - Stay on topic - ALWAYS ALWAYS use hashtag #DevDiscuss - Be NICE/POSITIVE ❤️ - Quoting tweets for clarity is encouraged
  • KPath001 Apr 25 @ 9:05 PM EDT
    What are some things to consider when building for the web when it comes to performance? #devdiscuss
    In reply to @ThePracticalDev
  • Brocco Apr 25 @ 9:06 PM EDT
    With modern web development performance is not just about the code you write but also about how you build and bundle your app. #DevDiscuss
  • Nick_Craver Apr 25 @ 9:07 PM EDT
    Remember how fast your page is doesn’t matter. How fast the user perceives it to be is what matters in almost all cases. #DevDiscuss
  • DanFellini Apr 25 @ 9:08 PM EDT
    Don't underestimate the value of a good sysadmin that can tune your server and make your code shine. #devdiscuss
  • bendhalpern Apr 25 @ 9:08 PM EDT
    Web performance is part scalability, part user experience. Early on, the focus needs to be on how performance effects UX. #DevDiscuss
    • KPath001 Apr 25 @ 9:05 PM EDT
      What are some things to consider when building for the web when it comes to performance? #devdiscuss
      In reply to @ThePracticalDev
  • mrskellyvaughn Apr 25 @ 9:09 PM EDT
    I've achieved a new record in performance stats 💪 #DevDiscuss
  • DanFellini Apr 25 @ 9:09 PM EDT
    And at the same time, don't rely on a sysadmin to make bad code shine. #DevDiscuss
  • wl_hunter Apr 25 @ 9:09 PM EDT
    Always cache your DOM queries #devdiscuss
    • KPath001 Apr 25 @ 9:05 PM EDT
      What are some things to consider when building for the web when it comes to performance? #devdiscuss
      In reply to @ThePracticalDev
  • Nick_Craver Apr 25 @ 9:09 PM EDT
    Also remember to measure *at the browser*. Rendering a page can be a very small piece of the overall time budget. Zoom out. #DevDiscuss
  • gumnos Apr 25 @ 9:10 PM EDT
    I struggle with this. I can write tests for wall-clock time, but writing tests for time-perception is a whole different game. #DevDiscuss
    In reply to @Nick_Craver
  • bendhalpern Apr 25 @ 9:10 PM EDT
    I love talking about web performance because it's something I like to obsess over when it comes to UX 😊 #DevDiscuss
  • dangolant Apr 25 @ 9:11 PM EDT
    reading suggestions for taking apps from single node instance, basic store to a performant, production ready affair? #devdiscuss
    In reply to @ThePracticalDev
  • gumnos Apr 25 @ 9:11 PM EDT
    The difference between latency & bandwidth. A fat pipe with a 2sec latency performs vastly diff. from a 3G with 0.01sec latency. #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:12 PM EDT
    IMO making a site w/ small file sizes makes that site more accessible because not everyone has unlimited data or fast speed. #devdiscuss
    • KPath001 Apr 25 @ 9:05 PM EDT
      What are some things to consider when building for the web when it comes to performance? #devdiscuss
      In reply to @ThePracticalDev
  • KPath001 Apr 25 @ 9:13 PM EDT
    Interesting!!! What would I have to keep in mind when developing with this in mind???#devdiscuss
    In reply to @gumnos, @ThePracticalDev
  • gumnos Apr 25 @ 9:13 PM EDT
    Also, as others have mentioned this evening, wall-time vs. user-perceived time. #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • nsatragno Apr 25 @ 9:13 PM EDT
    #devdiscuss web perf: service workers and an app shell architecture are key when network speed is the limiting factor.
  • KPath001 Apr 25 @ 9:14 PM EDT
    I would say UI deals with the the look whereas UX deals with how the user is interacting with your application #devdiscuss
    In reply to @rasputn_, @bendhalpern
  • KPath001 Apr 25 @ 9:14 PM EDT
    When talking about small file sizes are we talking modularization of the code as well or....? #devdiscuss
    In reply to @mrkhdly
  • Nick_Craver Apr 25 @ 9:15 PM EDT
    For those curious < Stack Overflow scale - I cover performance in a practical way on a blog move here: https://t.co/O8v1242M9T #DevDiscuss
  • gumnos Apr 25 @ 9:15 PM EDT
    I mostly set up lab conditions where I can throttle my bandwidth/latency, then test↔code until it's bearable. #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • bendhalpern Apr 25 @ 9:15 PM EDT
    One of my fave things about the https://t.co/E4yHRJkeOg project has been the ongoing performance focus. https://t.co/3VVKcEtfMC #DevDiscuss
  • dangolant Apr 25 @ 9:15 PM EDT
    😁 post-modernist web development: there is no objective truth, only what the user perceives #devdiscuss
    In reply to @elsharpo, @Nick_Craver
  • Nick_Craver Apr 25 @ 9:16 PM EDT
    In general: please remember that HTTP requests aren’t cheap. It’s never “18 <1KB files, who cares?” Requests cost, factor that. #DevDiscuss
  • daveaglick Apr 25 @ 9:16 PM EDT
    What's the number one "easy win" for performance of a totally unoptimized site? #DevDiscuss
    • ThePracticalDev Apr 25 @ 9:03 PM EDT
      Rules: - Stay on topic - ALWAYS ALWAYS use hashtag #DevDiscuss - Be NICE/POSITIVE ❤️ - Quoting tweets for clarity is encouraged
  • DamJess Apr 25 @ 9:16 PM EDT
    DOM & CSSOM for construction, layout, & painting!! Game changing to understand intimately. #devdiscuss Ref: https://t.co/TFkdFim8cN
    • KPath001 Apr 25 @ 9:05 PM EDT
      What are some things to consider when building for the web when it comes to performance? #devdiscuss
      In reply to @ThePracticalDev
  • gumnos Apr 25 @ 9:16 PM EDT
    Nothing says fun like experiencing your site over a simulated 2G, satellite, or 28.8k modem connection 😉 #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • DanFellini Apr 25 @ 9:17 PM EDT
    I think an easy win is optimizing images. #DevDiscuss
    In reply to @daveaglick
  • gumnos Apr 25 @ 9:17 PM EDT
    Though if HTTP/2 is available in the user-agent & server, it can mitigate a lot of latency issues. #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:17 PM EDT
    How slow do you throttle? Also what is bearable? #DevDiscuss
    In reply to @gumnos, @KPath001, @ThePracticalDev
  • KPath001 Apr 25 @ 9:18 PM EDT
    Thanks definitely reading this after this #devdiscuss session
    In reply to @DamJess
  • KPath001 Apr 25 @ 9:18 PM EDT
    haha that sounds like fun written all over it #devdiscuss
    In reply to @gumnos, @ThePracticalDev
  • SpecKtator_ Apr 25 @ 9:18 PM EDT
    Review your Critical Path. After deployment or a plugin upgrade... Maybe there's something you're missing... ϟϟϟϟ #devdiscuss
    In reply to @KPath001, @ThePracticalDev
  • gumnos Apr 25 @ 9:18 PM EDT
    Comes with the delightful annoyance of "things that are off-page on mobile are on-page on the desktop" 😉 #DevDiscuss
    In reply to @dangolant, @Nick_Craver
  • marccataford Apr 25 @ 9:20 PM EDT
    For #web perf, shoot for greed: as little data being transferred and as little power required from the user as possible. #devdiscuss #frugal
    In reply to @ThePracticalDev
  • crispy1260 Apr 25 @ 9:20 PM EDT
    It's so much harder to go back to fix performance issues then just doing it right the first time. #Performance #DevDiscuss
  • Nick_Craver Apr 25 @ 9:20 PM EDT
    If you’re unfamiliar with window.performance (browser-side timings), get to know it! Example page: https://t.co/sB3DMJ36DV #DevDiscuss
  • jacobc Apr 25 @ 9:20 PM EDT
    Remember to consider users on slower systems and slower connections (see Dan Luu's article on this: https://t.co/gvHhf6Lhwk) #DevDiscuss
  • haneycodes Apr 25 @ 9:20 PM EDT
    Caching! Definitely caching! #DevDiscuss
    In reply to @daveaglick
  • ahmedtakrouri Apr 25 @ 9:21 PM EDT
    #DevDiscuss I realized dev.to is so fast what technologies are used for client and server side🤔
  • mrm8488 Apr 25 @ 9:21 PM EDT
    For me web performance is about fast load and fluent behavior when interacting with the user #devdiscuss
    In reply to @dangolant, @ThePracticalDev
  • c0deNinja Apr 25 @ 9:21 PM EDT
    How do you measure render performance of a React component? Do wasted render cycles always result in poor performance? #DevDiscuss
    In reply to @ThePracticalDev
  • mrkhdly Apr 25 @ 9:21 PM EDT
    Modularization = getting the bare mininum to the user on first load & load in other resource such as images later? If so yes #DevDiscusS
    In reply to @KPath001
  • gumnos Apr 25 @ 9:21 PM EDT
    Depends on the project. One used IP-over-radio (latency & bandwidth were sucktacular), so had to test that. #DevDiscuss
    In reply to @mrkhdly, @KPath001, @ThePracticalDev
  • bendhalpern Apr 25 @ 9:21 PM EDT
    I'd check out @igrigorik's talks and writing on performance. Critical teachings in the domain https://t.co/nVSPk1c5rS #DevDiscuss
    In reply to @igrigorik
  • KPath001 Apr 25 @ 9:22 PM EDT
    Looks like I got a lot of reading to do tonight!!! Never even heard about this....thanks #devdiscuss
    In reply to @Nick_Craver
  • gldraphael Apr 25 @ 9:23 PM EDT
    Cache Wisely #DevDiscuss https://t.co/Gpnxx0qxO1
    In reply to @ThePracticalDev
  • DamJess Apr 25 @ 9:23 PM EDT
    What are your thoughts are on libraries in relation to performance? #devdiscuss
    In reply to @ThePracticalDev
  • KPath001 Apr 25 @ 9:23 PM EDT
    OH okay that makes perfect size and really optimizes the UX thanks for the great tip #devdiscuss
    In reply to @mrkhdly
  • gumnos Apr 25 @ 9:23 PM EDT
    But I like to simulate 56.6k & 2G as my low-end for gloating-purposes, but don't feel too bad if it requires 3G/128Kbps DSL #DevDiscuss
    In reply to @mrkhdly, @KPath001, @ThePracticalDev
  • gumnos Apr 25 @ 9:24 PM EDT
    And if it is usable on a 56k/2G connection, it can be an amazing experience on a "real" connection ☺ #DevDiscuss
    In reply to @mrkhdly, @KPath001, @ThePracticalDev
  • crispy1260 Apr 25 @ 9:24 PM EDT
    It's much harder to correct performance issues later than just doing it correctly in the first place. #DevDiscuss https://t.co/uMrFWkqkJ2
  • KPath001 Apr 25 @ 9:24 PM EDT
    I love the google IO talks, how do service workers help with web performance #devdiscuss
    In reply to @bendhalpern, @igrigorik
  • SpecKtator_ Apr 25 @ 9:25 PM EDT
    hmm... I would add Lazy Loading for first-aid and optimizing images as @danfellini already said #devdiscuss
    In reply to @DanFellini, @daveaglick, @DanFellini
  • bendhalpern Apr 25 @ 9:25 PM EDT
    Potential drawbacks of focusing too much on performance: Pesky caching bugs and lopsided architectures too optimized for perf. #DevDiscuss
  • andrewingram Apr 25 @ 9:26 PM EDT
    Don't assume that because A is slower than B, that you shouldn't use B. Overall performance of architecture is what matters #devdiscuss
    In reply to @ThePracticalDev
  • KPath001 Apr 25 @ 9:26 PM EDT
    Haha sounds like a fun lab you got there!!! Have to see if I can set one up for myself #devdiscuss
    In reply to @gumnos, @mrkhdly, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:26 PM EDT
    IMO users are visiting sites for content that largely is still text. Users should have to wait for a loader to read text. #DevDiscuss
    In reply to @KPath001
  • daveaglick Apr 25 @ 9:26 PM EDT
    There be dragons! #DevDiscuss
    In reply to @haneycodes
  • gumnos Apr 25 @ 9:27 PM EDT
    A couple fast wins: • caching • check image-sizes aren't bonkers • optimize images • HTTP/1.x, sprite images & concat CSS/JS #DevDiscuss
    In reply to @daveaglick
  • Nick_Craver Apr 25 @ 9:27 PM EDT
    Oh, and measure BEFORE and after changes. If you’re only measuring after, you don’t really have any clue what’s happened. #DevDiscuss
  • mrkhdly Apr 25 @ 9:28 PM EDT
    IMO users are visiting sites for content that largely is still text. Users shouldn't have to wait on a loader to read text. #DevDiscuss
    In reply to @KPath001
  • Nick_Craver Apr 25 @ 9:28 PM EDT
    Generic tip: don’t cache break based on date or commit, cache break based on file hash. Only force a re-fetch on ACTUAL changes. #DevDiscuss
  • bendhalpern Apr 25 @ 9:28 PM EDT
    Count those KBs! Some libs also can limit one's ability to do special things like async to not block rendering #devdiscuss
    In reply to @DamJess, @ThePracticalDev
  • gumnos Apr 25 @ 9:28 PM EDT
    And no, I've never intentionally throttled my virtual connection to 300 baud just to use the ed(1) text editor. 😇 #DevDiscuss
    In reply to @KPath001, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:29 PM EDT
    I know you can change the speed in the Dev Tools in Chrome, but how do you adjust latency? Is that outside the browser? #DevDiscuss
    In reply to @KPath001, @gumnos, @ThePracticalDev
  • SpecKtator_ Apr 25 @ 9:30 PM EDT
    Ohh shit! That's a fundamental one... nice #devdiscuss
    • Nick_Craver Apr 25 @ 9:27 PM EDT
      Oh, and measure BEFORE and after changes. If you’re only measuring after, you don’t really have any clue what’s happened. #DevDiscuss
  • gumnos Apr 25 @ 9:31 PM EDT
    I can set it up in a virtual machine or by using pf/iptables on BSD/Linux machines. e.g. https://t.co/Rrm9rE8NLY #DevDiscuss
    In reply to @mrkhdly, @KPath001, @ThePracticalDev
  • Nick_Craver Apr 25 @ 9:32 PM EDT
    Measure all the time, git tag your changes or annotate them with a date *somewhere* to compare before/after around later. #DevDiscuss
    In reply to @dangolant
  • gumnos Apr 25 @ 9:33 PM EDT
    "There are only two hard things in computer science: cache invalidation, naming things, and off-by-one errors." #DevDiscuss
    In reply to @daveaglick, @haneycodes
  • SpecKtator_ Apr 25 @ 9:34 PM EDT
    You can do it at network level, on your virtual nic (i guess) with tc command https://t.co/K2iR3Q2k9M #devdiscuss
    In reply to @mrkhdly, @KPath001, @gumnos, @ThePracticalDev
  • gumnos Apr 25 @ 9:34 PM EDT
    "lab" makes it sounds more glorified than "bunch of old machines on my desk hooked to the same switch." 😉 #DevDiscuss
    In reply to @KPath001, @mrkhdly, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:35 PM EDT
    Okay 👌 Doubt it but does a site ever behavior weirdly on extremely quick connections? 🤔 #DevDiscuss
    In reply to @gumnos, @KPath001, @ThePracticalDev
  • Nick_Craver Apr 25 @ 9:36 PM EDT
    Yes, things like AJAX races of concurrent runs, etc. manifest differently on both ends of the spectrum. #DevDiscuss
    In reply to @mrkhdly, @gumnos, @KPath001, @ThePracticalDev
  • daveaglick Apr 25 @ 9:36 PM EDT
    Huge fan of static sites & JAMstack, in large part because perf gains. @smashingmag @Netlify case study https://t.co/t9XrT5baa3 #DevDiscuss
  • gumnos Apr 25 @ 9:36 PM EDT
    In my experience, mostly in the "so-fast-you-miss-it" sense, but a little animation can help there. Race-conditions happen too. #DevDiscuss
    In reply to @mrkhdly, @KPath001, @ThePracticalDev
  • gumnos Apr 25 @ 9:38 PM EDT
    The ol' "Trust but verify" 😉 #DevDiscuss
    In reply to @DamJess, @ThePracticalDev
  • mrkhdly Apr 25 @ 9:38 PM EDT
    How would one test for something like this? 😕 I've only tested for slow speeds & will now look into latency testing. #DevDiscuss
    In reply to @Nick_Craver, @gumnos, @KPath001, @ThePracticalDev
  • orderwithchaos Apr 25 @ 9:38 PM EDT
    How quickly can users use the page? So, #webperf is everything to make it happen: page/data size, latency, server/client side .. #devdiscuss
    In reply to @ThePracticalDev
  • bendhalpern Apr 25 @ 9:39 PM EDT
    What's the benefit of a static site over caching the HTML result of a database-backed site and serving it from the CDN? #DevDiscuss
    In reply to @daveaglick, @smashingmag, @Netlify
  • Nick_Craver Apr 25 @ 9:40 PM EDT
    Can hook start/end handlers (e.g. jQuery global handlers) and incr/decr a counter to log on concurrent and such, for example. #DevDiscuss
    In reply to @mrkhdly, @gumnos, @KPath001, @ThePracticalDev
  • ThePracticalDev Apr 25 @ 9:41 PM EDT
    How have the principals of web performance changed with the newer view frameworks like React? What do devs need to account for #devdiscuss
  • Nick_Craver Apr 25 @ 9:42 PM EDT
    Not needing a database :) In my case: site is on GitHub pages, typos are a PR away, etc. Several benefits to it - situational. #DevDiscuss
    In reply to @bendhalpern, @daveaglick, @smashingmag, @Netlify
  • daveaglick Apr 25 @ 9:43 PM EDT
    You could make a case that's just a really complicated just-in-time static site generator :) #DevDiscuss
    In reply to @bendhalpern, @smashingmag, @Netlify
  • gumnos Apr 25 @ 9:43 PM EDT
    Accessibility & machine-navigability (particularly with single-page apps) #DevDiscuss #a11y
    In reply to @ThePracticalDev
  • mrkhdly Apr 25 @ 9:43 PM EDT
    Do you have a link that explains that more? Seems more advance than my knowledge level right now. 😓 #DevDiscuss
    In reply to @Nick_Craver, @gumnos, @KPath001, @ThePracticalDev
  • SpecKtator_ Apr 25 @ 9:43 PM EDT
    Don't measure performance with VirtualBox (#Vagrant) using shared folders. Use NFS instead https://t.co/xPKYAR3mE9 #devdiscuss
  • bendhalpern Apr 25 @ 9:43 PM EDT
    JS frameworks give a lot of power, but they take can away some ability to be frugal about the number of KBs going over the wire. #DevDiscuss
    • ThePracticalDev Apr 25 @ 9:41 PM EDT
      How have the principals of web performance changed with the newer view frameworks like React? What do devs need to account for #devdiscuss
  • bendhalpern Apr 25 @ 9:44 PM EDT
    JS frameworks give a lot of power, but they can take away some ability to be frugal about the number of KBs going over the wire. #DevDiscuss
    • ThePracticalDev Apr 25 @ 9:41 PM EDT
      How have the principals of web performance changed with the newer view frameworks like React? What do devs need to account for #devdiscuss
  • gumnos Apr 25 @ 9:44 PM EDT
    Ooh, gotta be careful. That really narrows down your client. To EVERY CLIENT OUT THERE. 😂 #DevDiscuss
    In reply to @mrskellyvaughn, @bathori, @ThePracticalDev
  • daveaglick Apr 25 @ 9:45 PM EDT
    At some point complexity of caching infra and making sure it correctly invalidates, etc. becomes more trouble then a generator #DevDiscuss
    In reply to @bendhalpern, @smashingmag, @Netlify
  • Nick_Craver Apr 25 @ 9:45 PM EDT
    Yeah but to be fair, that usually don’t happen until at least 6 minutes in. Maybe 8. #DevDiscuss
    In reply to @daveaglick, @bendhalpern, @smashingmag, @Netlify
  • estellevw Apr 25 @ 9:46 PM EDT
    Please help us understand perceived perf by taking the https://t.co/HkmoJUVSdr challenge. #devdiscuss #perfMatters
  • mrkhdly Apr 25 @ 9:47 PM EDT
    Thank you 🙏 The documentation makes it easier for me to understand. 140 character isn't enough sometimes 😊 #DevDiscuss
    In reply to @Nick_Craver, @gumnos, @KPath001, @ThePracticalDev
  • daveaglick Apr 25 @ 9:47 PM EDT
    Also absolutely no reason a database can't/shouldn't be used with a generator. It's all about *when* you build the page, not how #DevDiscuss
    In reply to @Nick_Craver, @bendhalpern, @smashingmag, @Netlify
  • bendhalpern Apr 25 @ 9:48 PM EDT
    The more control you hand over to the framework, less control you can have over performance issues. #DevDiscuss
  • Ky1e_S Apr 25 @ 9:49 PM EDT
    Principles of Progressive Web Apps can apply. See : https://t.co/GO8ibMTt54 @addyosmani #DevDiscuss
    In reply to @ThePracticalDev, @addyosmani
  • Nick_Craver Apr 25 @ 9:49 PM EDT
    Professional advice: PERFORMANCE IS STILL A FEATURE! It’s more page views, more engagement, more retention. It’s worth the time. #DevDiscuss
  • SpecKtator_ Apr 25 @ 9:49 PM EDT
    There's no SQL service calls. So you should only tune your #apache/#nginx and #PHP timings #devdiscuss
    In reply to @bendhalpern, @daveaglick, @smashingmag, @Netlify
  • samhausman Apr 25 @ 9:49 PM EDT
    w React, designing in line w their top down approach. Lots of time saved by IDing your key components early #DevDiscuss
    In reply to @ThePracticalDev
  • gumnos Apr 25 @ 9:50 PM EDT
    With extra anti-hacker protections available ☺ #DevDiscuss
    In reply to @daveaglick, @bendhalpern, @smashingmag, @Netlify
  • Nick_Craver Apr 25 @ 9:51 PM EDT
    Yeah but to be fair, that usually doesn’t happen until at least 6 minutes in. Maybe 8. #DevDiscuss
    In reply to @daveaglick, @bendhalpern, @smashingmag, @Netlify
  • AntJanus Apr 25 @ 9:51 PM EDT
    Target audience. If waiting longer brings more value to an enterprise customer, it's ok. For an average user it's not #devdiscuss
  • gumnos Apr 25 @ 9:51 PM EDT
    But with all things, measure to make sure it doesn't come at unacceptable cost. I can return HTTP/500 errors blindingly fast. 😉 #DevDiscuss
    In reply to @Nick_Craver
  • HandNF Apr 25 @ 9:52 PM EDT
    Security also matters. Even if A is slightly slower than B, it's worthwhile if users are protected. Saves trouble long-term. #devdiscuss
    In reply to @andrewingram, @ThePracticalDev
  • gumnos Apr 25 @ 9:52 PM EDT
    A good framework should still let you lift the hood and twiddle the performance knobs though. #DevDiscuss
    In reply to @bendhalpern
  • AntJanus Apr 25 @ 9:53 PM EDT
    I won't wait more than a few seconds at most for most apps. For an accounting summary, I don't mind longer wait times. #devdiscuss
  • gumnos Apr 25 @ 9:55 PM EDT
    There's value in psychological preparation. "Hey, this accounting report may take a while to run" "Cool" (grabs a drink) #DevDiscuss
    In reply to @AntJanus
  • Nick_Craver Apr 25 @ 9:57 PM EDT
    Also remember performance is more than just a time measurement. How fast you build, deploy, develop, etc. are all performance. #DevDiscuss
  • mrkhdly Apr 25 @ 9:59 PM EDT
    What type of software/reports are you running? My day job is bookkeeping so spend lots of time in QBO w/o much loading. #DevDiscuss
    In reply to @AntJanus, @gumnos