"Неродной рынок": хаки и нюансы работы на англоязычную аудиторию. (Иван Замесин, Chatfuel)
Юрий Буянов | (Одноклассники)Нюансы разработки...
-
Upload
rif-technology -
Category
Technology
-
view
202 -
download
0
Transcript of Юрий Буянов | (Одноклассники)Нюансы разработки...
![Page 1: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/1.jpg)
Сообщения Одноклассников
Нюансы разработки мобильного мессенджера
Юрий Буянов“Одноклассники” 2016
![Page 2: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/2.jpg)
Что и зачем
![Page 3: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/3.jpg)
Сложности
![Page 4: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/4.jpg)
Типы медиа• текст (с нестандартными смайлами, в том числе,
загружаемыми с сервера)
• картинки
• гифки
• видео
• аудиосообщения
• стикеры
• коллажи (текст + картинки + видео)
![Page 5: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/5.jpg)
![Page 6: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/6.jpg)
![Page 7: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/7.jpg)
Оптимизация
![Page 8: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/8.jpg)
Метрики быстродействия
![Page 9: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/9.jpg)
Оптимизации• Все тяжёлые операции — в фон
• Работа с БД
• Работа с сетью
• Сериализация/десериализация
• Работа с картинками
• Вёрстка и вычисление размеров текста
![Page 10: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/10.jpg)
Оптимизации
• Бенчмаркинг и выбор быстрых решений
• MessagePack
• Mantle -> YYModel
• lz4 fast compression
![Page 11: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/11.jpg)
Оптимизации• Оптимизация рендеринга (избавление от offscreen rendering) —
симптоматически
• UIViewContentModeCenter (по возможности)
• Упрощение иерархий UIView
• Кеширование всего
• “Тяжёлые” UIView
• Информация о размерах / вёрстке
• NSAttributedString
• YYTextLayout
• UIImage (нужного размера, decompressed, скруглённые углы)
![Page 12: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/12.jpg)
Протокол• TCP Socket (+TLS)
• Запрос-ответ
• Server-Side Push
• Транспорт легко поменять:
• Вебсокеты
• Шифрование на уровне пакета
![Page 13: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/13.jpg)
• Фиксированная длина• Opcode• Версия протокола• Длина payload• Seq index (для
связывания запроса с ответом)
Header Payload
• Переменная длина
• LZ4-compressed• MessagePack
Протокол
![Page 14: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/14.jpg)
Синхронизация и кеширование
![Page 15: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/15.jpg)
Синхронизация и кеширование
Чат 4
Чат 3
Чат 2
Чат 1
Чат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *Offline
![Page 16: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/16.jpg)
Синхронизация и кеширование
Чат 4
Чат 3
Чат 2
Чат 1
Чат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *Login
chatSync = 1472735750977
![Page 17: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/17.jpg)
Синхронизация и кеширование
Login ACK chats = […]chatSync =
1472735812543Чат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *
Чат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *
![Page 18: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/18.jpg)
Синхронизация и кеширование
OnlineЧат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *
Чат 4
Чат 3
Чат 2 *
Чат 1
Чат 5 *
![Page 19: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/19.jpg)
Кеш сообщений
? ?
Last Message
?ChunkInfoChunkInfo
Закешированные сообщения
![Page 20: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/20.jpg)
Кеш сообщений
? ?
Last Message
?ChunkInfoChunkInfo
Закешированные сообщения
? ? ChunkInfoChunkInfo
![Page 21: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/21.jpg)
Кеш сообщений
? ?
Last Message
?ChunkInfoChunkInfo
Закешированные сообщения
? ? ChunkInfoChunkInfo
? ? ChunkInfoChunkInfo
![Page 22: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/22.jpg)
Реализация
![Page 23: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/23.jpg)
YapDatabase• Key-Value (“на стероидах”)
• NSCoding или кастомная сериализация
• (нам нравится MessagePack)
• Асинхронность и многопоточность
• Объекты не привязаны к контексту
![Page 24: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/24.jpg)
Инициализация БД
![Page 25: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/25.jpg)
Инициализация БД
![Page 26: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/26.jpg)
Транзакции
![Page 27: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/27.jpg)
YapDatabase• Модель транзакций и данных — проще
• (субъективно)
• Осторожнее с параллельным доступом
• Обновляем объекты только в рамках одной транзакции
• Очень просто “реактивизировать” работу с БД
![Page 28: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/28.jpg)
Бесконечный скролл
0
new page
contentOffset
0
![Page 29: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/29.jpg)
Бесконечный скролл
0
new page
contentOffset0
![Page 30: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/30.jpg)
Бесконечный скролл
• Нужно переворачивать ячейки и быть аккуратнее с жестами
• Нужно переворачивать индексы в массиве моделей (пока, секции 🙁)
• Вычисления связанные с contentOffset/Inset немного взрывают мозг
• При скролле вниз проблема возвращается
![Page 31: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/31.jpg)
Обновление списков
• в одну секунду может идти несколько обновлений чата:
• подгрузка истории вверх
• новое сообщение
• обновление статуса старых сообщений (прочитано)
![Page 32: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/32.jpg)
Обновление списков
• Если анимация предыдущего обновления не кончилась, а следующее обновление уже поменяло данные (массив моделей ячеек) — случается креш
• Нужно отложить обновление данных до того момента как анимация закончится
• UIUpdateQueue
![Page 33: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/33.jpg)
UIUpdateQueue
![Page 34: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/34.jpg)
UIUpdateQueue
![Page 35: Юрий Буянов | (Одноклассники)Нюансы разработки мобильного мессенджера](https://reader035.fdocuments.net/reader035/viewer/2022062306/587290b51a28ab36118b6227/html5/thumbnails/35.jpg)
Спасибо
Юрий Буянов“Одноклассники” 2016ok.ru/digal
twitter.com/digal