This talk is centered around performance bottlenecks in regions like Africa. Also, it highlights ways to mitigate the effect of these network connectivity issues, using effective technology and the rapid growing developer community in Africa
8. The Problems
◎Everything can be fast but some works
reaaaally slowly.
◎Most times, there’s too little direct
product support.
◎Chrome dev tools can be inadequate for
mitigating performance bottlenecks.
◎Pricing models are too high with little
marketing.
8
10. ● Development architecture and pattern: PRPL,
microservices
● Optimized media delivery
● Diversified, test-driven deployment
● Supersimple deployment and support
● Community and user groups
10
11. 11
PRPL, JAMstack, and PWAs
PRPL
Push the critical resources for the initial
URL route.
Render the initial route.
Precache the remaining routes.
Lazy-load and create the remaining routes
on demand.
13. 13
◎Secure: Reduced risk of server attacks
◎Fast: Almost no client-server exchanges
◎Cost-effective: Thanks to Netlify, Now,
etc.
◎Smart: A fit for most sources
◎Familiar: Intuitive dev environment
JAMstack Features
PRPL, JAMstack, and PWAs
17. 17
Q: What are PWAs?
A: Cache everything!
Progressive Web Apps
PRPL, JAMstack, and PWAs
18. 18
◎A fit for offline or low-bandwidth networks
◎Mobile first with native-looking UI
◎Mobile app-like interface
◎Push notifications
PWA Features
PRPL, JAMstack, and PWAs
20. ◎Longer load time
◎More network data requirements
◎User drop-offs
◎Larger app size == higher hosting costs
◎Rage, anxiety, questions like “Why bother?”
20
Ill Effects of Improper
Image Optimization
Media Optimization
21. 21
◎Adopt lazy loads.
◎Serve from a CDN to reduce bundle size.
◎Practice abstract transformations for less
JavaScript logic.
◎Optimize images for responsiveness in all
devices.
◎Pay attention to First Meaningful Paint and
Time to Interactive.
Tips for Avoiding Bad Media
Media Optimization
22. 22
Media Tooling With Cloudinary
◎ Lazy-load files
◎ On-the-fly manipulation and transformation
with URLs
◎ Secure storage and delivery via CDNs
◎ Optimized and responsive image-delivery
◎ Free tier for developers
◎ Debugger
Media Optimization
27. “
27
“This is the system of effectively working with
distributed teams around the world to build
products with a test-driven approach, done by
these team members all over the world,
including in remote areas.”
— Chuloo, 2019
28. 28
Make deployment as easy as possible for
developer tools. Technical posts are a golden
reference.
Tools like Netlify, Now, and Surge are popular in
Africa because they are simple to use and deploy.
Continuous deployment workflows are highly
important and efficient.
Supersimple Deployment and
Support
31. ● Thousands of Africans are learning to
code and getting software jobs.
● Supporting brands are successful.
● African techies are contributing to
the global tech ecosystem.
● They’re solving many tech problems.
● More food and swag are at meetups.
Great fun!
31
Benefits of Communities
32. 32
What Dev Communities
Mean to You as a Builder
◎ You are giving back to a group of loyal builders
who in turn win you loyal users.
◎ You gain ease of entry to markets and understand
the best-fit pricing models.
◎ You benefit from independent advocates who
promote your product or brand.
◎ You get quick feedback on your product—from first
deployment to seasoned usage.
◎ You earn autonomous support from members who
use your product.
36. 36
Summary
◎Building fast apps to scale according to
modern development patterns and
architecture is the way to go.
◎Media optimization is superimportant.
◎Diverse teams make more robust international
products.
◎Communities and user groups invariably
promote product usage and support.
37. ● How can I build more scalable apps?
● Am I providing enough remote support
to product users and how can I better
support them through communities?
37
What Next?