The hidden cost of high res photos in web development

They say that a picture is worth a thousand words, but if that picture causes your website to load slow, Then it isn’t worth anything. It could be costing you greatly. Studies show that to prevent users drop off your website should load in 1-2 seconds. Any longer than that visitors become highly impatient and leave. One of the biggest and easiest to fix mistakes I’ve been seeing is new web developers not optimizing their image sizes for the web.

It’s great that you found some 4k high res 6000×5000 pictures that you can see every follicle of hair in that horse’s mane. However, not everyone is sitting at a workstation likely hard wired into a fast internet speed. More likely your visitors will be on a mobile device and using their data. The last thing they want is to watch your website sit and spin as you force them to download some 5MB high res photo that the web browser is going to downsize on the fly anyway to fit their tiny screen.

So what can we do about it? Well, we can attack it at two different angles. The first angle is image optimization is the act of decreasing file size without losing quality. The second angle would be implementing a lazy loading feature to allow the rest of your website’s content to load without having to wait for the bigger data files such as images to come across.

Image optimization can be done either at creation using a photo editing software like Adobe PhotoShop or GIMP. In that, you can reduce the photo resolution and size to be more web-friendly. Reducing a massive Photo from a DSLR into something more consumable like a 500×500 image can save possibly whole seconds and lots of data.
You can save even more data by running the image through an image optimizer such as TinyPNG.

The second prong attack will come from lazy loading. You can find an awesome lazy loading example here: Css Tricks Tutorials. In summary, you are going to use a super low resolution and lightweight photo, slap a blur effect on it, then replace the image with a high-quality one once it has finished loading across the network.

Utilizing these techniques can easily save you seconds off your load time, and drastically improve your sticking power with users. This will also improve your site’s SEO score which helps determine how it ranks in search engine results. Try out these methods and let me know how much time you shaved off!

Book Review: The Pragmatic Programmer

The Pragmatic Programmer gives true insight into what it means to be a Software Developer with the passion of an artisan. One who strives for improvement in the craft to make things better and more efficient not just for the pursuit of money, but for the sake of doing good work. This book provides an overview of all the different concepts, tools, and approaches to a software solution. I had a friend who said he imagined what I do to be out of the movie Swordfish. In reality, I’m no Hugh Jackman and we don’t spend our time typing at the speed of sound in an abandoned warehouse. Writing code is likely only a small portion of our job. We spend much more time, reading, conceptualizing, and breaking large problems into smaller more achievable ones.

What My friends think I do.

There are a lot of useful concepts in this book, instead of diving into detail I will give you a list, and a strong suggestion to read this book!

  • Always Be Learning and Improving
  • Avoid Over Engineering and Premature Optimization
  • Don’t Repeat Yourself (DRY)
  • Design Code that can be easily changed, Decoupled, Single Responsibility, and Readable
  • Mindset is as important as knowledge.
  • Own your mistakes, Don’t make excuses make solutions.
  • Unit tests are important, but Avoid Over-Testing
  • Version Control Everything!
  • Developers are people, not just a tool/resources.
  • Slice problems down to smaller more achievable chunks
  • Refactor when needed, No broken windows!
  • Think before speaking / hitting enter.

This book provides a great overview and insight on everyday software developer life, while not being overly long-winded. The topics covered in this book can be so valuable not only to new developers who need to learn about these cornerstone subjects but to existing developers to be reminded of the goal in which we strive towards. The book reads like a conversation of a wise developer bestowing all the wisdom tidbits he has gained over the years and finds worthy to pass on to the next generation.

I would say this book is easily a must-read for any developer at least once in your life, the topics are broad, easy to read, and invaluable for your journey towards mastery. Happy Coding Everyone!

Book Review: Patterns of Enterprise Application Architecture

This book by Martin Fowler and assorted others, was published in 2002, but still has content that is still applicable today. It’s a very slow and heavy read, however it is super interesting to see what influenced many of the frameworks that we use today.

This book goes over a collection of Enterprise application patterns that have been vetted in production environments. They are broken into different classifications: Layering, Concurrency, Session Management and Base Patterns. He then goes on to explain the pattern with diagrams, hierarchy and schema examples. Then ends each section with code examples and the pros and cons of each.

If you want more detailed information about the different patterns of enterprise application architecture, feel free to take a look at Martin Fowler’s website. https://www.martinfowler.com/eaaCatalog/

I think this book is a great tome of wisdom, however it needs an upgrade to match up to current design patterns. It was really valuable to see the patterns used at the time when some of our favorite frameworks were built, ie Rails, and .Net. This book is a great foundation for Architects and Engineers who are designing a service or want to learn more about patterns, however not all modern patterns are included at this point.

Why Software Developers Should Practice Meditation

Software development is one of the most stressful jobs in the world. The hours can be long, the work is often monotonous, and the deadlines are always looming. It’s no surprise that studies show software developers have among the highest rates of depression and burnout of any profession. The best way for software developers to cope with stress isn’t a vacation or a stiff drink at the end of the day. It’s meditation. Meditation is something you can do every day to help you stay calm, focused, and productive during your working hours.

Meditation is the practice of calming your mind and focusing on one thing. It is different from mindfulness, which involves being aware of what’s happening in the present moment without judging it. One of the main reasons why meditation is beneficial to your mental health is that it helps you to de-stress. When you’re feeling overwhelmed or anxious, meditation can be a great way to focus on something else and let go of negative thoughts. This may not seem like a big deal at first glance, but over time, meditation can help you to relax more quickly. This can be especially helpful if you often find yourself stressed out in certain situations, such as trying to fix a production-breaking bug or an AWS outage.

Meditation is a technique that you can use to increase your productivity. If you’re a software developer, you know that finding “Flow” state, that magical spot where everything fades away except for your editor and the code. After building a consistent meditation habit, you will find that it becomes easier for you to concentrate on a task for longer periods of time and be more productive.

Starting a meditation practice can help you improve your focus and concentration. That’s because meditation involves training your attention on one thing for long periods of time. This trains the mind to block out distractions that could otherwise pull your attention away from the task at hand. It also trains your concentration so that you can focus on the present moment instead of being distracted by thoughts about the past or future.

When you’re able to spend long periods of time in focused concentration, you’ll find it easier to accomplish even difficult tasks. Meditating regularly will make you better at writing code, designing products or working on any other challenging task that requires prolonged focus.

My main point is that anyone can benefit from meditation, regardless of what kinds of work or creative habits they have. Software developers are no different in this regard. If you’re a software developer, then I hope you’ll consider giving meditation a try, even if it seems outside your wheelhouse or a little crunchy. The benefits to the mind and body are simply too great to pass up. Be sure to let me know how your meditation practice works out, or if you have any questions about where to start.

Asking for Help is Not a Weakness

“Never let your ego get in the way of asking for help when in desperate need. We have all been helped at a point in our lives.” – Edmond Mbiaka

Developers often don’t ask for help soon enough. They sit and spin their tires determined to try to prove they can solve the problem themselves without any help. This can lead to shoddy code, wasted time, and frustration. This feeling can likely be traced back to the imposter syndrome that most developers feel no matter which stage of their career. That itching feeling that everyone knows that you have no clue what you are doing, that you don’t belong here, and if they find out that you can’t solve everything, fast and perfectly you might get fired. The truth is, everyone struggles and the most successful developers know where to find that line between a valiant attempt to solve a problem, and stubborn time-wasting out of fear and pride. 

Asking for help is not only good for you and solving the problem that is impacting the progress. It is also a valuable experience for the person whom you ask. The process of explaining the problem and finding a solution forces both of you to think deeply about how the system works to communicate it clearly.  

While we teach, we learn. – Seneca

The Roman philosopher Seneca said, “While we teach we learn”. This is what is known as the Protege effect. A study was conducted that found that students who tutored were more inclined to learn and retain knowledge at a higher rate than those who did not.  Obviously, we can’t ask for everyone to go out and find an apprentice like in olden times to teach the craft to. However, We find ways to teach through other means: Pair Programming, Blogging, making videos, journaling and tutoring. 

However, when you do ask for help it is important to keep a few things in mind. Asking for help can’t just be about you relying solely on the other person to fix your problem. It is still your responsibility to contribute, ask questions along the way. Ask for explanations of how the system works, why your attempts didn’t work, and how you could have approached the problem better in the future. There is nothing worse than someone saying they need help than sitting in silence or on their phone next to you while you complete their task. It is very reminiscent of school group projects when the one person doesn’t help and just adds their name to the title slide. Don’t be that guy. 

So don’t be afraid to reach out for help. Most of the time people will happily help you because it validates them in their own position in the field. Knowing someone comes to you for an answer makes you feel solidified and helps push down those feelings of imposter syndrome.