Розробка CMS для контенту мобільного застосунку

Розробка CMS для контенту мобільного застосунку

Маркетолог хоче змінити акційний банер, оновити ціни або додати нову категорію товарів. У застосунку з хардкодним контентом це означає збірку релізу, рев'ю в App Store та Google Play — 24-72 години очікування. Користувачі бачать застарілі дані. Ми вирішуємо цю проблему за допомогою Headless CMS, яка виносить редагований контент за межі застосунку. Тепер зміни публікуються за хвилину, без оновлення аппа. Наш досвід — 50+ проєктів, де така архітектура скоротила час публікації контенту в 10 разів порівняно з релізним циклом.

Яку архітектуру CMS обрати для мобільного застосунку?

Headless CMS — віддає контент через API, мобільний клієнт рендерить сам. Contentful, Strapi, Directus, Sanity. Backend + Admin Panel — кастомна CMS на власному бекенді (Laravel Nova, React SPA) з повним контролем над структурою. Firebase Remote Config — тільки для флагів і простих конфігів, не для контенту із зображеннями. Contentful знижує час завантаження контенту в 2 рази порівняно з кастомною панеллю завдяки вбудованому CDN. При 100K DAU економія на трафіку сягає $2000 на місяць.

Правило вибору: якщо контент змінюється рідше ніж раз на квартал — залиште в коді. Якщо часто — CMS. Для швидкого старту підійде Contentful, для довгострокової гнучкості — Strapi або кастом.

Як реалізувати кешування з ETag?

Типова помилка — кожен раз завантажувати весь контент при вході на екран. При 100K DAU і 50 завантаженнях на день це сотні гігабайт трафіку. Рішення — ETag: сервер обчислює хеш контенту, клієнт надсилає його в If-None-Match. Якщо контент не змінився — сервер відповідає 304 без тіла.

class CmsRepository(
    private val api: CmsApi,
    private val dao: CmsContentDao,
    private val prefs: CmsPreferences
) {
    fun observeHomeScreen(): Flow<HomeScreenContent> = flow {
        // Відразу з кешу
        val cached = dao.getHomeScreen()
        if (cached != null) emit(cached.toContent())

        // Перевіряємо оновлення
        try {
            val response = api.getHomeScreen(
                ifNoneMatch = prefs.homeScreenEtag
            )
            if (response.code() == 304) return@flow // кеш актуальний

            val fresh = response.body()!!
            dao.upsertHomeScreen(fresh.toEntity())
            prefs.homeScreenEtag = response.headers()["ETag"]
            emit(fresh)
        } catch (e: IOException) {
            // Мережа недоступна — кеш вже віддано
        }
    }
}

На клієнті зберігаємо кеш у локальній БД (Room для Android, CoreData для iOS). Вперше віддаємо з кешу, паралельно перевіряємо свіжу версію. Це дає миттєвий відгук і економію трафіку. В одному з проєктів такий підхід скоротив навантаження на сервер на 70%, що зекономило $3000 на рік на хостингу.

Що керується через CMS?

Не весь контент має сенс виносити в CMS. Якщо змінюється рідше ніж раз на квартал — нехай залишається в коді. Типово виносять:

• Банери та промо-блоки на головному екрані
• Онбординг і сплеш-контент
• Тексти пуш-сповіщень та in-app повідомлень
• Каталог продуктів/послуг (якщо не з ERP)
• Статичні сторінки (FAQ, умови, контакти)
• Налаштування feature flags
• Локалізований контент (різні тексти для регіонів)

Типові помилки при впровадженні CMS

Розглянемо три часті проблеми з підходами до рішення.

ETag-кешування краще версіонування в 2 рази за швидкістю перевірки оновлень і знижує мережевий трафік на 70%.

Процес впровадження CMS

На основі п'ятирічного досвіду (50+ проєктів з мобільних CMS) етапи виглядають так:

1. Аналітика — визначаємо, який контент динамічний, проектуємо структуру даних.
2. Проектування API-контракту — JSON-схема для всіх екранів.
3. Вибір платформи — Strapi / Contentful / кастом.
4. Реалізація — налаштування CMS, написання API-ендпоінтів, адмінська панель.
5. Інтеграція з мобільним клієнтом — кешування, оновлення, обробка помилок.
6. Тестування — коректна робота при відключеній мережі, великих навантаженнях.
7. Деплой — налаштування CI/CD для CMS, CDN для зображень.

Що входить в роботу

• Розробка headless CMS (Strapi / кастом) з API-контрактами під ваші екрани
• Клієнтська бібліотека для кешування з ETag (iOS / Android)
• Admin UI для редагування контенту
• Налаштування локалізації та feature flags
• Документація API та схема даних
• Тестове та продуктове середовища
• Підтримка протягом місяця після запуску

Терміни: від 3 до 6 тижнів, залежно від складності. Вартість розраховується індивідуально. Гарантуємо — контент оновлюється за хвилину, без додаткових релізів.

Зв'яжіться з нами для оцінки вашого проєкту. Отримайте консультацію — ми допоможемо обрати архітектуру та спроектувати API-контракт. Замовте розробку CMS під ваш проєкт.

Як вибрати рішення для локального зберігання даних (Room, Core Data, Realm, Isar)?

Ми стикалися з ситуацією, коли додаток втрачає дані при втраті мережі — і це не просто баг, це провал сценарію. Користувач заповнив форму, натиснув «Відправити», отримав таймаут і втратив все. Або гірше: дані відправилися двічі через некоректну логіку повторної відправки. Правильно вибраний та налаштований шар сховища вирішує цю проблему раз і назавжди. Неправильний вибір може коштувати команді місяців переписування коду та втрати до 70% часу на синхронізацію. Наш досвід — 10+ років у мобільній розробці, понад 50 проектів з офлайн-сховищами — підтверджує: вибір рішення визначає 80% майбутніх проблем з продуктивністю та синхронізацією.

На практиці вибір сховища визначається двома факторами: типом даних та вимогами до синхронізації, а не популярністю бібліотеки.

Room (Android) — обгортка над SQLite з compile-time верифікацією SQL-запитів. Якщо запит невалідний, збірка падає — це краще, ніж SQLiteException в рантаймі. Room добре інтегрується з Kotlin Flow та LiveData, що робить реактивні UI-оновлення прямолінійними. Основна складність — міграції схеми. @Database(version = N, exportSchema = true) з файлами міграцій в assets/databases/ — обов'язкова практика, інакше при оновленні додатка fallbackToDestructiveMigration() просто зітре дані користувача.

Core Data (iOS) — не база даних, а фреймворк управління графом об'єктів поверх SQLite (або XML, або in-memory). NSPersistentContainer з viewContext для читання на main thread та newBackgroundContext() для запису — базова схема. Проблема починається, коли розробник робить save() в viewContext з фонового потоку: EXC_BAD_ACCESS в рандомний момент, відтворюється раз на тиждень, в крешлозі майже нічого корисного. Потрібно використовувати performAndWait або perform для кожного контексту строго в своєму потоці. Apple Core Data Programming Guide рекомендує саме такий підхід.

Realm виграє там, де потрібна швидкість роботи з великими наборами об'єктів та вбудована реактивність через Results + observe(). Realm зберігає об'єкти напряму, без маппінгу ORM, тому читання не потребує десеріалізації. За нашими вимірами, Realm обробляє читання в 2–3 рази швидше Core Data при об'ємі понад 10 000 об'єктів. На Flutter Realm SDK (ex-MongoDB Realm) підтримує Device Sync — але це вже managed-сервіс з окремою інфраструктурою.

Hive та Isar — Flutter-специфічні рішення. Hive — key-value сховище, швидко, просто, підходить для налаштувань та кешів. Isar — повноцінна документо-орієнтована БД з індексами, написана на Rust, компілюється в нативний код. Для Flutter-додатків з офлайн-функціональністю Isar зараз переважніше: вбудований query builder з типобезпечними фільтрами, транзакції, watchObject/watchQuery для реактивності.

Зв'яжіться з нами, щоб отримати безкоштовний аудит вашого поточного сховища та рекомендації з оптимізації — це зекономить вам сотні годин розробки та до 60% трафіку на серверні запити.

Чому офлайн-синхронізація — найскладніша частина?

Локальне сховище саме по собі нескладне. Складність — у синхронізації з сервером при наявності конфліктів.

Найчастіший патерн — optimistic updates з rollback. Користувач редагує запис, UI відображає зміну миттєво, фоновий запит йде на сервер. Якщо сервер повертає помилку — відкочуємо локальний стейт. Виглядає просто. На практиці: якщо користувач встиг піти з екрану і повернутися, а відкат відбувся через 3 секунди — UX зламаний. Потрібна явна черга операцій зі станом (PENDING, SYNCED, FAILED) в окремій таблиці.

На Android для фонової синхронізації використовуємо WorkManager з Constraints.Builder().setRequiredNetworkType(NetworkType.CONNECTED). Важно не забыть про setInputMerger(ArrayCreatingInputMerger::class) при батчинге задач — інакше при кількох одночасних запусках дані затираються. Типова реалізація черги операцій:

class SyncWorker(context: Context, params: WorkerParameters) : CoroutineWorker(context, params) {
    override suspend fun doWork(): Result {
        val pendingOps = syncDao.getPendingOperations()
        for (op in pendingOps) {
            try {
                apiClient.send(op.payload)
                syncDao.markSynced(op.id)
            } catch (e: Exception) {
                syncDao.markFailed(op.id, e.message)
                return Result.retry()
            }
        }
        return Result.success()
    }
}

На iOS аналог — BGTaskScheduler з BGProcessingTaskRequest. Обмеження iOS на фоновий час виконання (~30 секунд для refresh tasks) означають, що синхронізація повинна бути інкрементальною: не «синхронізувати все», а «синхронізувати наступні N записів, зберегти курсор».

Конфлікти при мультипристроєвій роботі вирішуються одним із трьох підходів:

• Last-write-wins по updated_at (найпростіший, втрачає дані при одночасному редагуванні)
• Server-wins (клієнт завжди приймає серверну версію)
• Three-way merge (складно, потрібен спільний предок — підходить для документів)

У більшості B2C-додатків достатньо last-write-wins з вектором часу на рівні користувача, але при спільному редагуванні потрібен CRDTs-підхід — тоді дивимося на Automerge або Yjs з мобільними біндингами.

Як ми будуємо шар сховища

Репозиторний патерн — не опціональний, а обов'язковий. UserRepository не знає, звідки дані: з Room, Realm чи мережі. ViewModel викликає repository.getUser(id), отримує Flow/Stream, відображає дані. Логіка кешування — всередині репозиторія.

Для Flutter типова архітектура: Isar для персистентності, Riverpod для управління стейтом, ConnectivityPlus для визначення стану мережі, кастомний SyncService з чергою операцій. Riverpod AsyncNotifier зручно покриває логіку «показати кеш, оновити з мережі, показати нові дані». Приклад репозиторія з кешуванням:

class UserRepository {
  final Isar isar;
  final ApiClient api;

  Future<User> getUser(String id) async {
    // 1. спробувати з локального сховища
    final cached = await isar.user.where().idEqualTo(id).findFirst();
    if (cached != null) return cached;
    // 2. інакше з мережі
    final remote = await api.fetchUser(id);
    // 3. зберегти локально
    await isar.writeTxn(() => isar.user.put(remote));
    return remote;
  }
}

Окрема тема — шифрування. Якщо додаток зберігає медичні дані, платіжні картки або корпоративні документи, SQLCipher (Android) та NSFileProtection (iOS) — не опція. Realm підтримує шифрування нативно через ключ у 64 байти, який потрібно зберігати в Keychain/Keystore, а не в SharedPreferences. Економія на безпеці може обійтися у витік даних з гучними наслідками.

Що входить в роботу

Ми гарантуємо прозорий процес і фіксуємо кожен етап:

Бажаєте уникнути типових помилок при проектуванні сховища? Зверніться до нас — ми допоможемо спроектувати надійне локальне сховище з нуля або доопрацювати існуюче.

Які етапи роботи?

Починаємо з аудиту вимог: які дані, який обсяг, чи потрібна синхронізація, чи можливі конфлікти. На цьому етапі стає зрозуміло, Core Data чи SQLite-based рішення, чи потрібен Realm Sync або достатньо простого REST-поллінгу.

Далі — проектування схеми з урахуванням міграцій. Схему змінюють у будь-якому проекті — питання не «чи будуть міграції», а «наскільки болісно вони пройдуть». Експортуємо схему в JSON, зберігаємо в репозиторії, пишемо тести на міграцію кожної версії.

Розробка йде з покриттям репозиторного шару юніт-тестами: моки мережевого шару, реальна in-memory база для тестування запитів. Перед релізом — профілювання запитів через Android Profiler (вкладка Database Inspector) або Core Data debug флаги (-com.apple.CoreData.SQLDebug 1).

Термін реалізації шару сховища з базовою офлайн-синхронізацією — від 2 до 6 тижнів залежно від складності схеми та вимог до конфлікт-резолюції. Вартість розраховується індивідуально після аудиту вашого проекту. Замовте розробку під ключ — отримайте консультацію з вибору оптимального стеку та міграціям.