Developing a Comments System in a Mobile App
Comments are more complex than likes in many ways: nesting (or lack thereof by design), pagination, keyboard overlapping input field, @mentions within text, moderation. Most common complaint on custom implementations — "comments scroll jumps" or "keyboard covers last comment." Let's start with exactly that.
Keyboard Problem
On iOS UITableView or UICollectionView with comment list + UITextField at bottom. When keyboard appears, need to raise all content. Correct way — don't touch contentInset manually, use KeyboardLayoutGuide (iOS 15+): view.keyboardLayoutGuide.topAnchor.constraint(equalTo: inputView.bottomAnchor). On iOS 14 and below — subscribe to UIResponder.keyboardWillShowNotification and update tableView.contentInset.bottom.
After adding new comment — scroll to it: tableView.scrollToRow(at: lastIndexPath, at: .bottom, animated: true). Problem: if scrollToRow called before UITableView processes insertion (insertRows(at:with:)), crash on NSInternalInconsistencyException. Order: first beginUpdates → insertRows → endUpdates, then scrollToRow.
On Android with Compose — LazyColumn with reverseLayout = true (new messages at bottom) and imePadding() at column level. reverseLayout eliminates manual scroll down on comment add.
Data Structure and Nesting
Flat structure (all comments on same level) — simpler and works for most apps. Instagram does it: one comment level + replies via separate request.
If nesting needed: store parent_comment_id (nullable). Display maximum 2 levels — deeper not read. Load replies lazy: by default show "N answers," on tap load.
Pagination — cursor-based: GET /posts/{id}/comments?cursor=<last_id>&limit=20. For nested replies — separate endpoint GET /comments/{id}/replies.
Adding Comment
Optimistic add — mandatory. Locally generate client_comment_id, add to list with isPending = true, show spinner or gray text. On success — replace with server object. On error — show "Retry" button next to comment.
Input field — UITextView with auto-expansion (not UITextField): comments are often long. Limit 500-1000 characters with counter. Send button — active on non-empty text.
Deletion and Moderation
Delete own comment — swipe (iOS) or long-tap with bottom sheet. Don't remove deleted comment completely if it has replies — replace text with "Comment deleted." Otherwise child replies lose context.
Report comment — report_comment_id → moderation queue. Auto-hide on N reports (configurable) + manual review.
Comment Counter in Feed
Denormalized field comments_count in post table, incremented/decremented by trigger or queue. On comment add via app — update counter in UI optimistically.
Timeline
Flat comments with pagination, optimistic add, deletion — 2-3 business days. With nested replies, mentions, moderation — 5-7 days. Cost calculated individually.