Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Web Development Reading List #145: Font Loading Strategies, Scaling SVGs And Infinite Scrolling Done Right

I love articles that specifically focus on tiny little details within web development. For example, this week I stumbled upon an article featuring all the fine details about scheduling in requestAnimationFrame. Another gem I discovered is a widely unknown but very practical SVG attribute to preserve stroke widths while scaling an illustration. All of these little details can make such a huge difference in our projects, so I’m particularly thankful for having discovered these articles to share with you this week. Let’s dive in.

News Link

  • The beloved Git Tower app is coming to Windows1. I’m pretty sure that the pricing will be the same as for the Mac app and it’s great to see that this useful Mac app will soon be available to Windows users as well.

Generic Link

Tools & Workflows Link

  • Mango3 is a new tool that uses git as it was thought: in a decentralized, distributed way. They achieve that by baking in IPFS4 to store git objects. I’m happy this is available now and I’ll be sure to try it with an upcoming project.
Introducing the IPFS Alpha: it includes a fully functioning ipfs node, a unique style command line interface, an importable library, a json api for controlling the node programmatically, a gateway for exposing ipfs to regular web browsers, and a webui for managing your node.5
Introducing the IPFS Alpha: it includes a fully functioning ipfs node, a unique style command line interface, an importable library, a json api for controlling the node programmatically, a gateway for exposing ipfs to regular web browsers, and a webui for managing your node. (Image credit6)

HTML & SVG Link

  • All people say using links and buttons is very easy in web development. The truth is, I don’t think that’s true, especially since the decision makes a huge difference when it comes to accessibility for which the semantic choice can make a huge difference. Marcy Sutton tries to give real-world hints how you can figure out if an element visually looking like a button should be a button or a link instead7.
  • Nick Salloum shares how you can scale SVG graphics without scaling their borders8. This is very useful for outline icons which you want to homogeneously display in various sizes altogether. The effect is achieved through the widely unknown vector-effect attribute, which for example can have the non-scaling-stroke value.
Nick Salloum shows us how a SVG attribute can help us scale SVGs without scaling their strokes.9
Nick Salloum shows us how a SVG attribute can help us scale SVGs without scaling their strokes. (Check out the demo10)

JavaScript Link

An Android lock screen at the beginning of our EU referendum experiment.16
An Android lock screen at the beginning of our EU referendum experiment. (Image credit17)

Work & Life Link

  • “When you change your location, it’s a lot easier to wash away a lot of bad habits. That’s not to say if you move somewhere, you’ll become a different person, but you have a greater opportunity to make dramatic changes in your identity. […] This process, done over and over, makes you a more robust person. You not only become more adaptable, you gain increasing confidence and self-assurance that who you are is congruent with who you want to be.”—Taylor Pearson in “Change your location, change your life18”.
  • When you work on a project that is complex, it’s not easy to turn into a workflow where your team is able to ship small features fast19. Vanja Mimic shares how you can turn a project and deliver much faster.
  • Chen Hui Jing wrote a piece on Strategies for Healthier Dev20. It’s an important article about doing something about your fitness, including strategies for lazy people who don’t like pain and suffering, and things you can do with nearly zero effort.

And with that, I’ll close for this week. If you like what I write each week, please support me with a donation21 or share this resource with other people. You can learn more about the costs of the project here22. It’s available via email, RSS and online.

– Anselm

Footnotes Link

  1. 1 https://www.git-tower.com/p/windows-beta
  2. 2 https://www.zachleat.com/web/comprehensive-webfonts/
  3. 3 https://medium.com/@alexberegszaszi/mango-git-completely-decentralised-7aef8bcbcfe6
  4. 4 https://ipfs.io/
  5. 5 https://ipfs.io/
  6. 6 https://ipfs.io/
  7. 7 https://marcysutton.com/links-vs-buttons-in-modern-web-applications/
  8. 8 http://callmenick.com/post/svg-vector-effects
  9. 9 http://callmenick.com/post/svg-vector-effects
  10. 10 http://codepen.io/callmenick/full/jryOjN/
  11. 11 https://github.com/TalAter/awesome-service-workers
  12. 12 https://developers.google.com/web/updates/2016/07/infinite-scroller
  13. 13 https://philipwalton.com/articles/learning-how-to-set-up-automated-cross-browser-javascript-unit-testing/
  14. 14 https://medium.com/@paul_irish/requestanimationframe-scheduling-for-nerds-9c57f7438ef4
  15. 15 https://medium.com/the-guardian-mobile-innovation-lab/web-notifications-introduction-news-on-lock-screens-ba0d685cb4e2#.y60mm017q
  16. 16 https://medium.com/the-guardian-mobile-innovation-lab/web-notifications-introduction-news-on-lock-screens-ba0d685cb4e2#.wyd7o6jbz
  17. 17 https://medium.com/the-guardian-mobile-innovation-lab/web-notifications-introduction-news-on-lock-screens-ba0d685cb4e2#.wyd7o6jbz
  18. 18 http://taylorpearson.me/change-your-location-change-your-life/
  19. 19 https://www.smashingmagazine.com/2016/07/how-we-started-releasing-features-twice-as-fast-a-case-study/
  20. 20 https://www.chenhuijing.com/blog/healthier-dev/
  21. 21 https://wdrl.info/donate
  22. 22 https://wdrl.info/costs/

↑ Back to top Tweet itShare on Facebook

is a freelance front-end developer and architect and cares about sustainable front-end experiences and ethical choices in life. He curates the WDRL, a weekly handcrafted web development newsletter that thousands of developers love, subscribe to, and donate for.

  1. 1

    The link on scaling SVG graphics without scaling their borders, that’s what I was looking for today. Awesome!

    5
  2. 2

    Steve Britton

    July 15, 2016 3:23 pm

    Thank you for posting these weekly lists, I really enjoy reading them and find them informative and relevant !

    P.S. – For the Git Tower app, I guess people that are paying for this are not familiar with the free SourceTree app? SourceTree also has been supporting Windows for a few years now and Atlassian is constantly rolling out new features.

    5
    • 3

      Anselm Hannemann

      July 15, 2016 4:17 pm

      I assume many people are familiar or have tried Sourcetree before. But for me, the interface of Sourcetree is very unintuitive and Tower beats that by far with an easily understandable app. That said, Sourcetree is a great alternative to it, if you’re happy with the UI and UX. There are also other alternatives like the Github app for windows. :)

      2
  3. 4

    Vibrant Info

    July 18, 2016 9:21 am

    Thanks for providing such a useful information.

    2
  4. 5

    gregg barber

    July 18, 2016 2:15 pm

    I don’t get why there are always so many down votes on comments on Smashing articles . . I expect to see a lot of down votes from Youbillies, on YouTube but, on this site !

    -1
    • 6

      Steven J Britton

      July 29, 2016 2:21 pm

      I feel like the voting numbers are a bit confusing because the number (green or red) sits next to the down thumb, so appears that all votes are down votes at first glance.

      1
  5. 7

    Ravish Sundriyal

    July 20, 2016 8:31 pm

    You made my life really simple. Thank you for sharing this, really appreciated.

    0

↑ Back to top