Slide 1
Slide 1 text
Front-end Productivity Engineering
@ Sale Stock
Slide 2
Slide 2 text
Welcome!
Slide 3
Slide 3 text
Who are we?
Slide 4
Slide 4 text
Sale Stock
● eCommerce focusing on women’s fashion items
● Became a company in late 2014
● Started as an FB group
● Used third-party ecommerce-platform named Sirclo
● Mid-2015 launched internally-built website
● Now largest women vertical and fashion vertical ecommerce
in Indonesia
● Bigger than incumbent competitors:
○ Zalora
○ BerryBenka
● 500+ employees (~150 white collars, ~350 blue collars)
Slide 5
Slide 5 text
Why care about engineering productivity?
Slide 6
Slide 6 text
● Sale Stock is a vertically integrated company
○ Sourcing, Designing, Manufacturing, Warehousing, Delivery, Marketing
● Sale Stock builds lots of software
○ Mostly internal
○ Publicly visible properties are tip of the iceberg -- most of engineering
resources are spent internally
● Sale Stock doesn’t hire a lot of developers
○ We run 1000+ containers, 185 microservices with two infra engineers
○ Team members need to be capable
○ Give them great environment to work in
○ Give them well-designed tooling
Slide 7
Slide 7 text
No content
Slide 8
Slide 8 text
No content
Slide 9
Slide 9 text
No content
Slide 10
Slide 10 text
No content
Slide 11
Slide 11 text
No content
Slide 12
Slide 12 text
No content
Slide 13
Slide 13 text
… and lots more.
Slide 14
Slide 14 text
How do we make sure we can execute?
Slide 15
Slide 15 text
Separation of engineering layers
Slide 16
Slide 16 text
Separation of engineering layers
- Engineering in Sale Stock is divided into two major parts:
- Feature engineering
- Platform / Infrastructure engineering
Slide 17
Slide 17 text
- Build for other engineers
- Build framework-level abstractions
- Decide what third-party frameworks to use
- Build custom abstractions / APIs
- Build tooling
- Performance / productivity measured by contribution to engineering
team’s collective productivity:
- Aggregate engineering time saved at both the platform & feature
layer
- General abstraction stability
Platform Engineers
Slide 18
Slide 18 text
Feature Engineers
- Build software for end customers
- Using abstractions built by platform engineers
- Performance / productivity measured by contribution to products
- Ideas
- Speed of iteration
- Feature stability
Slide 19
Slide 19 text
Shared codebase Web & Apps
● We don’t have platform-specific teams
● Write once on React, instant deploy to web and apps
with React Web and React Native
● Lower level primitives abstraction to render different
sets of platform primitives.
○ =>
○ => ![]()
○ =>
○ etc
Slide 20
Slide 20 text
Monorepo
- Single git repo for 185+ microservices
- Why not a repo per service?
- Higher project overhead
- Less silo-ing of knowledge
- Lighter context switching
- Easy code sharing without complex internal code registry
- Implements trunk-based development
- Single “master” branch
- Encourage short-lived feature branch per feature, merged into master
- Gain iterative culture, deployment safety
Slide 21
Slide 21 text
Centralized and self-service tooling
- Reduce double work & over-scaffolding
- Reduce Bureaucracy
- Bureaucracy: the latency it takes from someone wanting to do
something to the time he / she actually is able to do it.
- Involves time
- Involves organizational complexity
Slide 22
Slide 22 text
SSI
- Internal command line tool
- Contains commands to easen regular workloads -- gives
uniform way across the company to:
- Initialize new service source code
- Initialize databases
- Develop services
- Deploys services
- Run automated tests
- Monitoring
- Lots of other things
- Allows feature engineers to own services & features
end-to-end
Slide 23
Slide 23 text
SSI
- Nice tidbit: requesting for a Redis, MySQL, or a Cassandra
database with ssi @ Sale Stock takes you:
- Under five minutes (one minute in the case of Redis)
- talk to exactly 0 person
- Bureaucracy nicely dismantled!
Slide 24
Slide 24 text
Cloud Devbox
- Developers within Sale Stock are given a personal “devbox” -- remote
development machine.
- Software developed within Sale Stock increasingly gets more
complicated and distributed -- laptop hardware ceiling is quickly
reached.
- Deployed in the same cluster as the production workloads for higher
hardware utilization (using Kubernetes).
- Uses FB’s nuclide IDE for remote code editing
- Uses syncthing for laptop<-->devbox filesystem syncing.
Slide 25
Slide 25 text
Automated Test Suite
Slide 26
Slide 26 text
Automated Test Suite
1. Core Test Suite
2. Comprehensive Test Suite
3. Continuous Production Smoke Test
Slide 27
Slide 27 text
Core Test Execution
● Runs on every merge cycle of our www codebase
● Optimized for the best coverage-over-speed investment ratio
● Consists of hundreds of functional test cases
● Runs on 20-node test cluster for speedy execution
● Results decide whether we execute auto-deploy for latest merge
● Deploy the same version to React Native Versioner
Slide 28
Slide 28 text
Comprehensive Test Execution
● Ultra-complete test coverage -- covers much more user usage paths
● Runs on multiple devices and browsers
● Runs periodically out of merge cycle
Slide 29
Slide 29 text
Continuous Prod Smoke Test
● Runs continuously against prod environment
● Simulates real users
● More sane, useful, accurate form of continuous monitoring compared
to regular uptime alerting.
Slide 30
Slide 30 text
Feature Gating
Slide 31
Slide 31 text
Feature Gating
● Allows specific code paths to be activated to a subset of users
● Reduces chance of bugs to be exposed to large number of users
● Allows engineers to be deservedly less cautious about launching
faster
Slide 32
Slide 32 text
No content
Slide 33
Slide 33 text
Edge Architecture
Slide 34
Slide 34 text
No content
Slide 35
Slide 35 text
No content
Slide 36
Slide 36 text
No content
Slide 37
Slide 37 text
Edge Architecture
● All external-origin requests into the microsystem goes through an
Edge.
● All UI applications have their own Edge service counterpart
● But how do the edge servers work?
Slide 38
Slide 38 text
GraphQL
● A client-side-to-server data query language
● Alternative to REST
● Allows engineer to fetch exactly what they need (no underfetch /
overfetch)
● Allows engineer to re-use queries for different features as they see fit
● All SS UI applications now use GraphQL for data fetching
Slide 39
Slide 39 text
GraphQL
Slide 40
Slide 40 text
GraphQL
Slide 41
Slide 41 text
GraphQL Object Sharing
● Multiple products within Sale Stock needs access to the
same GraphQL objects
● Introduced internal abstraction called Edge Object.
● Allows UI engineers to compose edge objects in their UI
servers to build out features quickly
● Edge Object abstracts the dirty work of talking to
single/multiple microservices to fetch the actual data for
the particular object -- allowing UI engineers to
concentrate on UI.
Slide 42
Slide 42 text
No content
Slide 43
Slide 43 text
No content
Slide 44
Slide 44 text
No content
Slide 45
Slide 45 text
Tidbits about Loader
● Object type’s field-level resolver function -- last layer of
abstraction that talks to the actual microservice holding the
data for the field
● Does performance optimizations under the hood:
○ Request deduplication
○ Request batching
○ Applies to multiple request contexts (external-origin requests originating
from multiple customers can result in a single call to a microservice if
they request similar data)
● Allows complex objects to be resolved in an
quickly-implementable, performant manner
Slide 46
Slide 46 text
There’s many more.. But that’s it.
Slide 47
Slide 47 text
We’re Hiring!
Slide 48
Slide 48 text
We’re Hiring!
Some of our team members hail from:
Slide 49
Slide 49 text
We’re Hiring!
Positions:
Software Engineer - Infrastructure
Software Engineer - Frontend
Software Engineer - Backend
Software Engineer - Quality Engineering
Data Scientist
Business Intelligence Analyst
Slide 50
Slide 50 text
We’re Hiring!
Competitive salary
Company shares
Option for working remotely
Relocation support
Skills development support
Health benefits cover family
Lunch and meals provided
Flexible working hours
Career development
Periodic team gathering
Regular company hackathon
Slide 51
Slide 51 text
careers.salestock.io
Slide 52
Slide 52 text
Thanks for your time!