powering fast-paced product iterations front-end apis · powering fast-paced product iterations....
TRANSCRIPT
![Page 1: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/1.jpg)
Front-End APIsPowering Fast-Paced Product Iterations
![Page 2: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/2.jpg)
Speakers
Jeff WeinerChief Executive Officer
Aditya ModiStaff Software Engineer
Karthik RamgopalSr Staff Software Engineer
![Page 3: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/3.jpg)
Overview
History and evolution of frontend APIs at LinkedIn
Our API structure today
Learnings and results
Sneak peek at the future
![Page 4: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/4.jpg)
2 Years Ago
![Page 5: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/5.jpg)
Mobile v/s Desktop
Feed on mobile Feed on desktopFeed on iPad
![Page 6: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/6.jpg)
Client - Server setup
mobile-frontend-API tablet-frontend-API homepage-frontend-API profile-frontend-API
Android iOS Tablet homepage-desktop-web profile-desktop-web
![Page 7: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/7.jpg)
• Huge API surface and diversity
• No IDL/schema backing API
• Slow iteration speed
Problems?
![Page 8: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/8.jpg)
Today
![Page 9: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/9.jpg)
Mobile v/s Desktop
Feed on mobile Feed on desktopFeed on iPad
![Page 10: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/10.jpg)
Client - Server setup
flagship-frontend-API
flagship-android flagship-iOS flagship-desktop-webflagship-mobile-web
Rest + JSON over HTTP2
Mid-tier . . . . Mid-tier
![Page 11: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/11.jpg)
• > 120k QPS
• ~425 developers
• ~30 commits per day
Scale
![Page 12: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/12.jpg)
• Automated continuous release
• commit to production in < 3 hours
• 3 deployments a day
3x3 Deployment
![Page 13: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/13.jpg)
Modeling
![Page 14: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/14.jpg)
• Backed by Strongly Typed Schemas
• Backward-compatible evolution
• No endpoint versioning
Principles
![Page 15: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/15.jpg)
{ "type": "record", "name": "TestRecord", "namespace": "com.linkedin.test", "doc": "Test", "fields": [ { "name": "id", "type": "String", "doc": "ID" }, { "name": "name", "type": "String", "doc": "Name", “optional”: true }, ]}
@interface TestRecord : NSObject
@property(nonnull, copy) NSString *id;@property(nullable, copy) NSString *name;
@end
class TestRecord {
@NonNull public final String id; @Nullable public final String name;
}
export default DS.Model.extend({
id: DS.attr(‘string’),
name: DS.attr(‘string’)
});
Schema definition
iOS
Android
Web
![Page 16: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/16.jpg)
Entity Modeling
• Return - Collection<Card>
![Page 17: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/17.jpg)
Composite screens
● Two top level resources
■ Invitations
■ PYMK (People You May Know)
● 1 network call to fetch both resources
■ Infrastructure level aggregation support
![Page 18: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/18.jpg)
• Easy to model
• Decouple API from UI
• Client side consistency
Advantages
![Page 19: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/19.jpg)
Client side consistency
![Page 20: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/20.jpg)
Client side consistency
• Why ?
○ Good UX
○ Optimistic writes
![Page 21: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/21.jpg)
Client side consistency
Can you do this auto-magically?
![Page 22: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/22.jpg)
Client side consistency
Payload Cache
![Page 23: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/23.jpg)
Client side consistency
Payload Cache
![Page 24: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/24.jpg)
Client side consistency
Cache Payload
![Page 25: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/25.jpg)
Everything is awesome, right?
![Page 26: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/26.jpg)
Takes a long time to ship a feature
API Server
1.5 weeks
iOS
2 weeks
Android
2 weeks
Web
2 weeks
Total time
3.5 weeks=+
Use case: Introduce a new kind of notification
![Page 27: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/27.jpg)
• Create new models for every feature
• Write code on each client platform
• Wait for native app release/adoption
Why so long?
![Page 28: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/28.jpg)
Challenge
Cut this down to 1 day!
![Page 29: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/29.jpg)
• Quickly build and release notifications
• Increase user engagement
• Sweet and sticky, just like honey!
Project Honeycomb
![Page 30: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/30.jpg)
• New notifications WITHOUT app updates
• Client side consistency
• Stellar runtime performance
Beyond iteration speed...
![Page 31: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/31.jpg)
• Model based on how the UI view looks
• Similar views grouped into 1 template
• More UI specific logic on API server
View Template API
![Page 32: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/32.jpg)
Share notification
Share Template
● PrimaryImage: URL?● Title: AttributedString● Timestamp: Long● ShareImage: URL?● ShareTitle: String● LikeCount: Long? (Default: 0)● CommentCount: Long? (Default: 0)
![Page 33: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/33.jpg)
Now let’s look at a slightly different notification
Modify Share Template
● PrimaryImage: URL?● Title: AttributedString● Timestamp: Long● ShareImage: URL?● ShareTitle: String AttributedString● ShareSubtitle: AttributedString?● LikeCount: Long? (Default: 0)● CommentCount: Long? (Default: 0)
![Page 34: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/34.jpg)
How about something radically different?
Work Anniversary Template
● PrimaryImage: URL?● Title: AttributedString● Timestamp: Long
![Page 35: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/35.jpg)
Something slightly different again?
Work Anniversary/New Position Template
● PrimaryImage: URL?● Title: AttributedString● Timestamp: Long● BodyText: AttributedString?
![Page 36: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/36.jpg)
How do we return a heterogeneous list?
• Use Rest.li paginated collections. Differentiate between items using a Union.
• JSON payload structure:
{
“elements” : [
{“Share”: {“Title”: “Sarah Clatterbuck shared a…”, ...}},
{“Anniversary”: {“Title”: “Congratulate Nitish Jha…”, ...}},
....
],
“paging”: { “start” : 0, “count”: 10, “paginationToken”: “xydsad”}
}
![Page 37: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/37.jpg)
Minor payload optimization
• Embed the type into the payload to reduce nesting.
• JSON payload structure:
{
“elements” : [
{“Type”: “Share”, “Title”: “Sarah Clatterbuck shared a…”, ...},
{“Type”: “Anniversary”, “Title”: “Congratulate Nitish Jha…”, ...},
....
],
“paging”: { “start” : 0, “count”: 10, “paginationToken”: “xydsad”}
}
![Page 38: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/38.jpg)
• Code-generated response parser
• Bind model to native views
• Write once* per layout, reuse.
Client side rendering
![Page 39: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/39.jpg)
Backward compatibility
{
“elements” : [
{“Stat”: {“Title”: “Your Profile...”, ...}},
{“JYMBII”: {“Title”: “5 Jobs you”, ...}},
{“Share”: {“Title”: “Swati Mathur...”, ...}},
....
],
“paging”: { “start” : 0, “count”: 10, “paginationToken”: “xydsad”}
}
Drop unknown notification types.
![Page 40: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/40.jpg)
Backward compatibility
Drop unknown fields based on product needs.
![Page 41: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/41.jpg)
• New notification types without client changes
• Renders faster on the clientBenefits
![Page 42: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/42.jpg)
But… Client side Consistency is lost!
![Page 43: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/43.jpg)
How do we solve this?
![Page 44: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/44.jpg)
How did we solve the AttributedString problem?
• Model formatted text
• Control formatting from the server
• Impractical to use HTML
AttributedString
![Page 45: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/45.jpg)
AttributedString schema
AttributedString
● Text: String● Attributes: List[Attribute] BOLD, ITALIC, UNDERLINE etc.
Attribute
● Type: AttributeType ● StartIndex: Int● Length: Int● Metadata: Any?
![Page 46: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/46.jpg)
Platform specific binding
Infrastructure provided support
iOS
Android
Web
NSAttributedString
Spannable
HTML
AttributedString
![Page 47: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/47.jpg)
What if we extended this concept to entity mentions?
Model entity mentions also as a custom formatting specifier.
Profile mention Profile mention
![Page 48: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/48.jpg)
Introducing TextViewModel
TextViewModel
● Text: String● Attributes: List[TextViewAttribute]
TextViewAttribute
● Type: TextViewAttributeType● StartIndex: Int● Length: Int● Metadata: Any?
● Profile: Profile?● Job: Job?● Company: Company?● Course: Course?
Flattened canonical entities as optional fields
Similar to AttributedString
![Page 49: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/49.jpg)
Entity mentions
Entities could be mentioned in different ways.
First NameFull Name
Position
![Page 50: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/50.jpg)
TextViewAttributeType
TextViewAttributeType
● PROFILE_FIRST_NAME● PROFILE_FULL_NAME● PROFILE_HEADLINE● PROFILE_DISTANCE● COMPANY_NAME● COMPANY_HEADLINE● JOB_TITLE● ….
If a particular type is used, then the corresponding entity is populated by the server.
● PROFILE_XXX types will populate the profile field for example with the corresponding profile.
![Page 51: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/51.jpg)
Backward compatibility++
Old clients cannot handle new mention types. Always send Raw text though redundant.
{
“title” : {
“Text”: “Sarah Clatterbuck shared this”,
“Attributes”: [
{“Type”: “PROFILE_FULL_NAME”,
“StartIndex”: 0….}
]
}
}
![Page 52: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/52.jpg)
• Singular and Plurals
• Possessive forms
• i10n and i18n
Watch Out
![Page 53: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/53.jpg)
How about images?
Use the same concept as TextViewModel. Introduce ImageViewModel.
ImageViewModel
● Attributes: List[ImageViewAttribute]
ImageViewAttribute
● ImageViewAttributeType● URL: URL?● ResourceName: String?● Profile: Profile?● Job: Job?● Company: Company?● Course: Course?
Flattened canonical entities as optional fields
![Page 54: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/54.jpg)
ImageViewAttributeType
ImageViewAttributeType
● URL● RESOURCE_NAME● PROFILE_IMAGE● PROFILE_BACKGROUND● COMPANY_IMAGE● ….
If a particular type is used, then the corresponding entity is populated by the server.
● PROFILE_XXX types will populate the profile field for example with the corresponding profile.● URL type will populate the image URL● RESOURCE_NAME will populate the pre-canned resource name.
![Page 55: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/55.jpg)
Rendering Images
● Infra code extracts Image URL out of ImageViewModel
● Load into platform specific image view.
One Attribute: Regular ImageView
Multiple Attributes: GridImageView
![Page 56: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/56.jpg)
Performance considerations
Entities may repeat multiple times within the same notification causing payload size bloat.
Tim’s Profile in ImageViewModel Tim’s Profile in TextViewModel
![Page 57: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/57.jpg)
Solution: Response Normalization
All canonical entities have a unique ID. Use a JSON API like response format.
{
“data” : {
“Profile”: “profile:123”, ...
},
“included”: [
{
“id” : “profile:123”, “firstName” : “Tim”, “LastName” : “Jurka”, ... }
},
....
]
}
![Page 58: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/58.jpg)
Performance considerations (Continued)
All fields from the entities may not be used.
ImageURL First Name and Last Name
![Page 59: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/59.jpg)
Solution: Deco
Deco is a LinkedIn framework that allows selective projection and decoration of fields.
Profile in TextViewModel
IDFirstNameLastName
Profile in ImageViewModel
IDImageURL
Profile in Response
IDFirstNameLastNameImageURL
![Page 60: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/60.jpg)
Results
![Page 61: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/61.jpg)
Improved Developer and Product Velocity
9 new notification types in all of 201616 new notification types in May and June 2017
![Page 62: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/62.jpg)
API model reduction
42 API models for old UI6 API models for new UI
![Page 63: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/63.jpg)
Code size reduction
15k LOC app and test code for old UI3k LOC app and test code for new UI
![Page 64: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/64.jpg)
Future Direction
● Extend to other pages in Flagship
● Extend to other LinkedIn apps like JobSeeker, Recruiter etc.
![Page 65: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/65.jpg)
Out of scope for this talk
● Intricate details of client side consistency management
● Generic Modeling of actions
● Challenges in migrating from the old notifications API to the new one
Find us after the talk, and we’re happy to chat about this and more.
![Page 66: Powering Fast-Paced Product Iterations Front-End APIs · Powering Fast-Paced Product Iterations. Speakers Jeff Weiner Chief Executive Officer Aditya Modi Staff Software Engineer Karthik](https://reader033.vdocument.in/reader033/viewer/2022042806/5f6b14ebbab11125e379ceba/html5/thumbnails/66.jpg)
Q & A
[email protected]://www.linkedin.com/in/modiaditya/
Aditya [email protected]
https://www.linkedin.com/in/karthikrg/
Karthik Ramgopal