Giantpaper.org

Tag: webdev

  • npm: 34 downloads for @giantpaper/animate.scss

    DAAAYUUUM GUYS 😱 34 downloads in one week!!!!!! People really want that animate.css in SASS!

  • Trying out Github….again

    Trying out Github….again

    I actually signed up for Github about 2 years ago, but never did anything with it. There are a few test repos but barely anything that has to do with code. Nowadays, it’s almost expected for you to be on Github if you’re a webdev.


    Even if you’re working solo, it’s great for code management (need to push some bug fixes live, but don’t want to make the new big, alpha-stage features live just yet? Put the new alpha-stage features in a new branch, have the bug fixes be on the main branch, then LIVE!).

    Here are two repos I have up that I’m fairly proud of:

    • animate.scss – A SASS/SCSS port of animate.css. This is just a straight port, with no added features or animations. I tried it out…I think it works great, but as far as I know, I’m the only person using it. 👀
    • breakpoints.js – Inspired by Twitter Bootstrap’s breakpoint mixins, but for Javascript.
  • GPORG’s Lighthouse Scores

    GPORG’s Lighthouse Scores

    I don’t really use Chrome, unless if it’s for work purposes. So that’s probably why I didn’t know you could use Lighthouse in the webdev tools window. 😱

    Soo yeah, this was the best I could for GPORG (on the homepage). Apparently it is possible to get 100s all four, but almost impossible unless if you have an extremely barebones, one-page site. Some of the stuff Lighthouse wants you to do to score a 100 under Performance and Best Practices is kind of ridiculous:

    • Remove unused CSS & JS — I mean…I once I figured out tree-shaking, the Performance score went from 80s to 90s. The only reason why it’s not a 100 is because the “unused” CSS & JS is being used on other pages (like the CSS for the Gutenberg blocks), and I still need that for things to display correctly. But Lighthouse doesn’t know that, so I still got dinged. If the CSS & JS files were much bigger due to code being used on other pages, I would’ve gotten a lower score.
      • Also depending on how many plugins you have that bring their own (required) code to the party, you might see a lower score.
      • And also? Adding things like tracking scripts can generate a lower score.
    • Reduce server load — not getting this one anymore, but when I was still getting it, it was like…”how???” I had a pretty darn good caching plugin, combined with Cloudflare with memcached enabled, soo….🤷‍♀️
    • Registers an unload listener — this is caused by the WPBruiser plugin, injecting some embedded JS directly onto the page. There’s no way for me remove that, and even if I could, I have no way of knowing if it would break the plugin.

    Moral of the story — use Lighthouse as a guide but don’t lose sleep over it. (The only scores I care about really is accessibility and SEO, both of which I got 100s on.)

    – THE END –