SlideShare a Scribd company logo
SPEED UP ADD CUSTOM
MARKER ON GOOGLE MAP
ANDYANG@ANDROID TAIPEI
ABOUT ME
▸ Andy 楊哲偉
▸ ⾞車車⿇麻吉 Android Developer
▸ kotlin, rxjava 愛好者
▸ Android Code Club (Taipei) Organizer
▸ 最近愛上寫 coding dojo
AGENDA
▸ Background
▸ Why add makers very slowly on google map?
▸ How to improve?
▸ LEVEL 0 (no custom marker)
▸ LEVEL 1 (custom marker)
▸ LEVEL 2 (cache marker bitmap)
▸ LEVEL 3 (double cache & thread)
▸ Recap
▸ Q&A
Live Demo Source Code
https://github.com/
bng86/SpeedUpMarker
BACKGROUND
▸ Marker
▸ lat/lng
▸ icon (custom)
▸ Fetch data
▸ bounding box
▸ center lat/lng with radius
▸ google map api add marker (on main thread)
WHY ADD MAKERS VERY SLOWLY ON GOOGLE MAP?
▸ add each marker blocking UI thread 1~10 ms
▸ add marker can’t on background thread
▸ custom marker generator bitmap
▸ create marker instance after add maker
▸ Marker addMarker(markerOptions)
LEVEL 0
▸ add marker without custom icon
DEMO
LEVEL 1
▸ add marker custom icon with
dynamic data
▸ blocking ui thread
DEMO
LEVEL 2
▸ reuse bitmap resource for same data
▸ using data class define marker data
▸ LRUCache reuse Bitmap
DEMO
LEVEL 3
▸ cache marker & data (LRUCache)
▸ generator bitmap, check marker cache do in background
thread
▸ delay emitter data distributed blocking main thread
▸ limit max alive marker on map
DEMO
RECAP
▸ cache bitmap
▸ cache marker
▸ generate and calculate do in background
▸ delay emitter data
▸ limit max alive marker
Q&A

More Related Content

Similar to Speed up add custom marker on google map

Building spatial back ends with Node.js and MongoDB
Building spatial back ends with Node.js and MongoDBBuilding spatial back ends with Node.js and MongoDB
Building spatial back ends with Node.js and MongoDB
Shekhar Gulati
 
5 Ways to Optimize Your LiDAR Data
5 Ways to Optimize Your LiDAR Data5 Ways to Optimize Your LiDAR Data
5 Ways to Optimize Your LiDAR Data
Safe Software
 
Mastering MicroStation DGN: How to Integrate CAD and GIS
Mastering MicroStation DGN: How to Integrate CAD and GISMastering MicroStation DGN: How to Integrate CAD and GIS
Mastering MicroStation DGN: How to Integrate CAD and GIS
Safe Software
 
Flutter study jam - Begineers (1st level)
Flutter study jam - Begineers (1st level)Flutter study jam - Begineers (1st level)
Flutter study jam - Begineers (1st level)
Tarek Alabd
 
5 Ways to Improve Your LiDAR Workflows
5 Ways to Improve Your LiDAR Workflows5 Ways to Improve Your LiDAR Workflows
5 Ways to Improve Your LiDAR Workflows
Safe Software
 
Code to Add Google Map to Websites
Code to Add Google Map to WebsitesCode to Add Google Map to Websites
Code to Add Google Map to Websites
Fortune Innovations Dublin
 
CartoView - Configure and Publish Apps for GeoNode
CartoView - Configure and Publish Apps for GeoNodeCartoView - Configure and Publish Apps for GeoNode
CartoView - Configure and Publish Apps for GeoNode
Adam Joseph
 
Google Apps Script: Accessing G Suite & other Google services with JavaScript
Google Apps Script: Accessing G Suite & other Google services with JavaScriptGoogle Apps Script: Accessing G Suite & other Google services with JavaScript
Google Apps Script: Accessing G Suite & other Google services with JavaScript
wesley chun
 
Ez Community Gandbox.fr
Ez Community Gandbox.frEz Community Gandbox.fr
Ez Community Gandbox.fr
Gilles Guirand
 
Introduction to Cloud Computing with Google Cloud
Introduction to Cloud Computing with Google CloudIntroduction to Cloud Computing with Google Cloud
Introduction to Cloud Computing with Google Cloud
wesley chun
 
Exploring Google (Cloud) APIs with Python & JavaScript
Exploring Google (Cloud) APIs with Python & JavaScriptExploring Google (Cloud) APIs with Python & JavaScript
Exploring Google (Cloud) APIs with Python & JavaScript
wesley chun
 
Using Google (Cloud) APIs
Using Google (Cloud) APIsUsing Google (Cloud) APIs
Using Google (Cloud) APIs
wesley chun
 
Building Custom Visual Composer Elements
Building Custom Visual Composer ElementsBuilding Custom Visual Composer Elements
Building Custom Visual Composer Elements
Burak Dogan
 
Discover Angular - Meetup 15/02/2017
Discover Angular - Meetup 15/02/2017Discover Angular - Meetup 15/02/2017
Discover Angular - Meetup 15/02/2017
Stéphane Este-Gracias
 
Rene Groeschke
Rene GroeschkeRene Groeschke
Rene Groeschke
CodeFest
 
Designerfair 2011
Designerfair 2011Designerfair 2011
Designerfair 2011
douglee650
 
Angular2, Spring Boot, Docker Swarm
Angular2, Spring Boot, Docker SwarmAngular2, Spring Boot, Docker Swarm
Angular2, Spring Boot, Docker Swarm
🐊 Erwin Alberto
 
Android L08 - Google Maps and Utilities
Android L08 - Google Maps and UtilitiesAndroid L08 - Google Maps and Utilities
Android L08 - Google Maps and Utilities
Mohammad Shaker
 
Meteor.js for DOers
Meteor.js for DOersMeteor.js for DOers
Meteor.js for DOers
ShavonnahTiera
 
Foss4g2016 Geopaparazzi Workshop
Foss4g2016 Geopaparazzi WorkshopFoss4g2016 Geopaparazzi Workshop
Foss4g2016 Geopaparazzi Workshop
Andrea Antonello
 

Similar to Speed up add custom marker on google map (20)

Building spatial back ends with Node.js and MongoDB
Building spatial back ends with Node.js and MongoDBBuilding spatial back ends with Node.js and MongoDB
Building spatial back ends with Node.js and MongoDB
 
5 Ways to Optimize Your LiDAR Data
5 Ways to Optimize Your LiDAR Data5 Ways to Optimize Your LiDAR Data
5 Ways to Optimize Your LiDAR Data
 
Mastering MicroStation DGN: How to Integrate CAD and GIS
Mastering MicroStation DGN: How to Integrate CAD and GISMastering MicroStation DGN: How to Integrate CAD and GIS
Mastering MicroStation DGN: How to Integrate CAD and GIS
 
Flutter study jam - Begineers (1st level)
Flutter study jam - Begineers (1st level)Flutter study jam - Begineers (1st level)
Flutter study jam - Begineers (1st level)
 
5 Ways to Improve Your LiDAR Workflows
5 Ways to Improve Your LiDAR Workflows5 Ways to Improve Your LiDAR Workflows
5 Ways to Improve Your LiDAR Workflows
 
Code to Add Google Map to Websites
Code to Add Google Map to WebsitesCode to Add Google Map to Websites
Code to Add Google Map to Websites
 
CartoView - Configure and Publish Apps for GeoNode
CartoView - Configure and Publish Apps for GeoNodeCartoView - Configure and Publish Apps for GeoNode
CartoView - Configure and Publish Apps for GeoNode
 
Google Apps Script: Accessing G Suite & other Google services with JavaScript
Google Apps Script: Accessing G Suite & other Google services with JavaScriptGoogle Apps Script: Accessing G Suite & other Google services with JavaScript
Google Apps Script: Accessing G Suite & other Google services with JavaScript
 
Ez Community Gandbox.fr
Ez Community Gandbox.frEz Community Gandbox.fr
Ez Community Gandbox.fr
 
Introduction to Cloud Computing with Google Cloud
Introduction to Cloud Computing with Google CloudIntroduction to Cloud Computing with Google Cloud
Introduction to Cloud Computing with Google Cloud
 
Exploring Google (Cloud) APIs with Python & JavaScript
Exploring Google (Cloud) APIs with Python & JavaScriptExploring Google (Cloud) APIs with Python & JavaScript
Exploring Google (Cloud) APIs with Python & JavaScript
 
Using Google (Cloud) APIs
Using Google (Cloud) APIsUsing Google (Cloud) APIs
Using Google (Cloud) APIs
 
Building Custom Visual Composer Elements
Building Custom Visual Composer ElementsBuilding Custom Visual Composer Elements
Building Custom Visual Composer Elements
 
Discover Angular - Meetup 15/02/2017
Discover Angular - Meetup 15/02/2017Discover Angular - Meetup 15/02/2017
Discover Angular - Meetup 15/02/2017
 
Rene Groeschke
Rene GroeschkeRene Groeschke
Rene Groeschke
 
Designerfair 2011
Designerfair 2011Designerfair 2011
Designerfair 2011
 
Angular2, Spring Boot, Docker Swarm
Angular2, Spring Boot, Docker SwarmAngular2, Spring Boot, Docker Swarm
Angular2, Spring Boot, Docker Swarm
 
Android L08 - Google Maps and Utilities
Android L08 - Google Maps and UtilitiesAndroid L08 - Google Maps and Utilities
Android L08 - Google Maps and Utilities
 
Meteor.js for DOers
Meteor.js for DOersMeteor.js for DOers
Meteor.js for DOers
 
Foss4g2016 Geopaparazzi Workshop
Foss4g2016 Geopaparazzi WorkshopFoss4g2016 Geopaparazzi Workshop
Foss4g2016 Geopaparazzi Workshop
 

More from 哲偉 楊

Specification unit test by Spek
Specification unit test by SpekSpecification unit test by Spek
Specification unit test by Spek
哲偉 楊
 
Code kata 的自我修煉
Code kata 的自我修煉Code kata 的自我修煉
Code kata 的自我修煉
哲偉 楊
 
Coding dojo
Coding dojoCoding dojo
Coding dojo
哲偉 楊
 
輕輕鬆鬆產生 changelog
輕輕鬆鬆產生 changelog輕輕鬆鬆產生 changelog
輕輕鬆鬆產生 changelog
哲偉 楊
 
Spek
SpekSpek
Jenkins for android developer at TWJUG
Jenkins for android developer at TWJUGJenkins for android developer at TWJUG
Jenkins for android developer at TWJUG
哲偉 楊
 
自己的 Jenkins 自己來 for Android developer
自己的 Jenkins 自己來  for Android developer自己的 Jenkins 自己來  for Android developer
自己的 Jenkins 自己來 for Android developer
哲偉 楊
 
從開發到上線的華麗大冒險
從開發到上線的華麗大冒險從開發到上線的華麗大冒險
從開發到上線的華麗大冒險
哲偉 楊
 
Kotlin初體驗
Kotlin初體驗Kotlin初體驗
Kotlin初體驗
哲偉 楊
 
Kotlin 初體驗
Kotlin 初體驗Kotlin 初體驗
Kotlin 初體驗
哲偉 楊
 
Unit test and ui testing with cucumber
Unit test and ui testing with cucumberUnit test and ui testing with cucumber
Unit test and ui testing with cucumber
哲偉 楊
 
RxJava With retrolambda
RxJava With retrolambdaRxJava With retrolambda
RxJava With retrolambda
哲偉 楊
 
ORMLite Android
ORMLite AndroidORMLite Android
ORMLite Android
哲偉 楊
 
設計師合作經驗分享
設計師合作經驗分享設計師合作經驗分享
設計師合作經驗分享
哲偉 楊
 
Dog point
Dog pointDog point
Dog point
哲偉 楊
 
Gson
GsonGson
Hybrid design with bootstrap
Hybrid design with bootstrapHybrid design with bootstrap
Hybrid design with bootstrap
哲偉 楊
 

More from 哲偉 楊 (17)

Specification unit test by Spek
Specification unit test by SpekSpecification unit test by Spek
Specification unit test by Spek
 
Code kata 的自我修煉
Code kata 的自我修煉Code kata 的自我修煉
Code kata 的自我修煉
 
Coding dojo
Coding dojoCoding dojo
Coding dojo
 
輕輕鬆鬆產生 changelog
輕輕鬆鬆產生 changelog輕輕鬆鬆產生 changelog
輕輕鬆鬆產生 changelog
 
Spek
SpekSpek
Spek
 
Jenkins for android developer at TWJUG
Jenkins for android developer at TWJUGJenkins for android developer at TWJUG
Jenkins for android developer at TWJUG
 
自己的 Jenkins 自己來 for Android developer
自己的 Jenkins 自己來  for Android developer自己的 Jenkins 自己來  for Android developer
自己的 Jenkins 自己來 for Android developer
 
從開發到上線的華麗大冒險
從開發到上線的華麗大冒險從開發到上線的華麗大冒險
從開發到上線的華麗大冒險
 
Kotlin初體驗
Kotlin初體驗Kotlin初體驗
Kotlin初體驗
 
Kotlin 初體驗
Kotlin 初體驗Kotlin 初體驗
Kotlin 初體驗
 
Unit test and ui testing with cucumber
Unit test and ui testing with cucumberUnit test and ui testing with cucumber
Unit test and ui testing with cucumber
 
RxJava With retrolambda
RxJava With retrolambdaRxJava With retrolambda
RxJava With retrolambda
 
ORMLite Android
ORMLite AndroidORMLite Android
ORMLite Android
 
設計師合作經驗分享
設計師合作經驗分享設計師合作經驗分享
設計師合作經驗分享
 
Dog point
Dog pointDog point
Dog point
 
Gson
GsonGson
Gson
 
Hybrid design with bootstrap
Hybrid design with bootstrapHybrid design with bootstrap
Hybrid design with bootstrap
 

Recently uploaded

FULL STACK PROGRAMMING - Both Front End and Back End
FULL STACK PROGRAMMING - Both Front End and Back EndFULL STACK PROGRAMMING - Both Front End and Back End
FULL STACK PROGRAMMING - Both Front End and Back End
PreethaV16
 
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
upoux
 
ITSM Integration with MuleSoft.pptx
ITSM  Integration with MuleSoft.pptxITSM  Integration with MuleSoft.pptx
ITSM Integration with MuleSoft.pptx
VANDANAMOHANGOUDA
 
Sri Guru Hargobind Ji - Bandi Chor Guru.pdf
Sri Guru Hargobind Ji - Bandi Chor Guru.pdfSri Guru Hargobind Ji - Bandi Chor Guru.pdf
Sri Guru Hargobind Ji - Bandi Chor Guru.pdf
Balvir Singh
 
SENTIMENT ANALYSIS ON PPT AND Project template_.pptx
SENTIMENT ANALYSIS ON PPT AND Project template_.pptxSENTIMENT ANALYSIS ON PPT AND Project template_.pptx
SENTIMENT ANALYSIS ON PPT AND Project template_.pptx
b0754201
 
paper relate Chozhavendhan et al. 2020.pdf
paper relate Chozhavendhan et al. 2020.pdfpaper relate Chozhavendhan et al. 2020.pdf
paper relate Chozhavendhan et al. 2020.pdf
ShurooqTaib
 
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTERUNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
vmspraneeth
 
Beckhoff Programmable Logic Control Overview Presentation
Beckhoff Programmable Logic Control Overview PresentationBeckhoff Programmable Logic Control Overview Presentation
Beckhoff Programmable Logic Control Overview Presentation
VanTuDuong1
 
comptia-security-sy0-701-exam-objectives-(5-0).pdf
comptia-security-sy0-701-exam-objectives-(5-0).pdfcomptia-security-sy0-701-exam-objectives-(5-0).pdf
comptia-security-sy0-701-exam-objectives-(5-0).pdf
foxlyon
 
Determination of Equivalent Circuit parameters and performance characteristic...
Determination of Equivalent Circuit parameters and performance characteristic...Determination of Equivalent Circuit parameters and performance characteristic...
Determination of Equivalent Circuit parameters and performance characteristic...
pvpriya2
 
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
DharmaBanothu
 
Applications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdfApplications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdf
Atif Razi
 
一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理
uqyfuc
 
Introduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.pptIntroduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.ppt
Dwarkadas J Sanghvi College of Engineering
 
SELENIUM CONF -PALLAVI SHARMA - 2024.pdf
SELENIUM CONF -PALLAVI SHARMA - 2024.pdfSELENIUM CONF -PALLAVI SHARMA - 2024.pdf
SELENIUM CONF -PALLAVI SHARMA - 2024.pdf
Pallavi Sharma
 
Unit -II Spectroscopy - EC I B.Tech.pdf
Unit -II Spectroscopy - EC  I B.Tech.pdfUnit -II Spectroscopy - EC  I B.Tech.pdf
Unit -II Spectroscopy - EC I B.Tech.pdf
TeluguBadi
 
Introduction to Artificial Intelligence.
Introduction to Artificial Intelligence.Introduction to Artificial Intelligence.
Introduction to Artificial Intelligence.
supriyaDicholkar1
 
Butterfly Valves Manufacturer (LBF Series).pdf
Butterfly Valves Manufacturer (LBF Series).pdfButterfly Valves Manufacturer (LBF Series).pdf
Butterfly Valves Manufacturer (LBF Series).pdf
Lubi Valves
 
Digital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptxDigital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptx
aryanpankaj78
 
Blood finder application project report (1).pdf
Blood finder application project report (1).pdfBlood finder application project report (1).pdf
Blood finder application project report (1).pdf
Kamal Acharya
 

Recently uploaded (20)

FULL STACK PROGRAMMING - Both Front End and Back End
FULL STACK PROGRAMMING - Both Front End and Back EndFULL STACK PROGRAMMING - Both Front End and Back End
FULL STACK PROGRAMMING - Both Front End and Back End
 
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
一比一原版(uofo毕业证书)美国俄勒冈大学毕业证如何办理
 
ITSM Integration with MuleSoft.pptx
ITSM  Integration with MuleSoft.pptxITSM  Integration with MuleSoft.pptx
ITSM Integration with MuleSoft.pptx
 
Sri Guru Hargobind Ji - Bandi Chor Guru.pdf
Sri Guru Hargobind Ji - Bandi Chor Guru.pdfSri Guru Hargobind Ji - Bandi Chor Guru.pdf
Sri Guru Hargobind Ji - Bandi Chor Guru.pdf
 
SENTIMENT ANALYSIS ON PPT AND Project template_.pptx
SENTIMENT ANALYSIS ON PPT AND Project template_.pptxSENTIMENT ANALYSIS ON PPT AND Project template_.pptx
SENTIMENT ANALYSIS ON PPT AND Project template_.pptx
 
paper relate Chozhavendhan et al. 2020.pdf
paper relate Chozhavendhan et al. 2020.pdfpaper relate Chozhavendhan et al. 2020.pdf
paper relate Chozhavendhan et al. 2020.pdf
 
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTERUNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
UNIT-III- DATA CONVERTERS ANALOG TO DIGITAL CONVERTER
 
Beckhoff Programmable Logic Control Overview Presentation
Beckhoff Programmable Logic Control Overview PresentationBeckhoff Programmable Logic Control Overview Presentation
Beckhoff Programmable Logic Control Overview Presentation
 
comptia-security-sy0-701-exam-objectives-(5-0).pdf
comptia-security-sy0-701-exam-objectives-(5-0).pdfcomptia-security-sy0-701-exam-objectives-(5-0).pdf
comptia-security-sy0-701-exam-objectives-(5-0).pdf
 
Determination of Equivalent Circuit parameters and performance characteristic...
Determination of Equivalent Circuit parameters and performance characteristic...Determination of Equivalent Circuit parameters and performance characteristic...
Determination of Equivalent Circuit parameters and performance characteristic...
 
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
A high-Speed Communication System is based on the Design of a Bi-NoC Router, ...
 
Applications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdfApplications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdf
 
一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理
 
Introduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.pptIntroduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.ppt
 
SELENIUM CONF -PALLAVI SHARMA - 2024.pdf
SELENIUM CONF -PALLAVI SHARMA - 2024.pdfSELENIUM CONF -PALLAVI SHARMA - 2024.pdf
SELENIUM CONF -PALLAVI SHARMA - 2024.pdf
 
Unit -II Spectroscopy - EC I B.Tech.pdf
Unit -II Spectroscopy - EC  I B.Tech.pdfUnit -II Spectroscopy - EC  I B.Tech.pdf
Unit -II Spectroscopy - EC I B.Tech.pdf
 
Introduction to Artificial Intelligence.
Introduction to Artificial Intelligence.Introduction to Artificial Intelligence.
Introduction to Artificial Intelligence.
 
Butterfly Valves Manufacturer (LBF Series).pdf
Butterfly Valves Manufacturer (LBF Series).pdfButterfly Valves Manufacturer (LBF Series).pdf
Butterfly Valves Manufacturer (LBF Series).pdf
 
Digital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptxDigital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptx
 
Blood finder application project report (1).pdf
Blood finder application project report (1).pdfBlood finder application project report (1).pdf
Blood finder application project report (1).pdf
 

Speed up add custom marker on google map

  • 1. SPEED UP ADD CUSTOM MARKER ON GOOGLE MAP ANDYANG@ANDROID TAIPEI
  • 2. ABOUT ME ▸ Andy 楊哲偉 ▸ ⾞車車⿇麻吉 Android Developer ▸ kotlin, rxjava 愛好者 ▸ Android Code Club (Taipei) Organizer ▸ 最近愛上寫 coding dojo
  • 3. AGENDA ▸ Background ▸ Why add makers very slowly on google map? ▸ How to improve? ▸ LEVEL 0 (no custom marker) ▸ LEVEL 1 (custom marker) ▸ LEVEL 2 (cache marker bitmap) ▸ LEVEL 3 (double cache & thread) ▸ Recap ▸ Q&A
  • 4. Live Demo Source Code https://github.com/ bng86/SpeedUpMarker
  • 5. BACKGROUND ▸ Marker ▸ lat/lng ▸ icon (custom) ▸ Fetch data ▸ bounding box ▸ center lat/lng with radius ▸ google map api add marker (on main thread)
  • 6. WHY ADD MAKERS VERY SLOWLY ON GOOGLE MAP? ▸ add each marker blocking UI thread 1~10 ms ▸ add marker can’t on background thread ▸ custom marker generator bitmap ▸ create marker instance after add maker ▸ Marker addMarker(markerOptions)
  • 7. LEVEL 0 ▸ add marker without custom icon
  • 9. LEVEL 1 ▸ add marker custom icon with dynamic data ▸ blocking ui thread
  • 10. DEMO
  • 11. LEVEL 2 ▸ reuse bitmap resource for same data ▸ using data class define marker data ▸ LRUCache reuse Bitmap
  • 12. DEMO
  • 13. LEVEL 3 ▸ cache marker & data (LRUCache) ▸ generator bitmap, check marker cache do in background thread ▸ delay emitter data distributed blocking main thread ▸ limit max alive marker on map
  • 14. DEMO
  • 15. RECAP ▸ cache bitmap ▸ cache marker ▸ generate and calculate do in background ▸ delay emitter data ▸ limit max alive marker
  • 16. Q&A