Interface Builder, Storyboard - Nên dùng hay không?

Trong iOS, để lập trình giao diện cho các app, chúng ta có 2 cách:

• Interface Builder (IB): bao gồm các file NIB (NeXT Interface Builder, ngày nay gọi là XIB) hoặc dùng Storyboard.
• Sử dụng custom code.

Interface Builder là một thành phần được Apple thêm vào Xcode, giúp đơn giản hóa việc thiết kế giao diện người dùng mà không cần đến một dòng code. Developer đơn giản chỉ cần kéo, thả các view, button, textfield... vào một cửa sổ design, giúp developer có một cái nhìn trực quan với UI đang xây dựng. UI sau khi kéo thả và nhìn thấy ngay sẽ được Xcode lưu trữ dưới dạng XML. Storyboard, cái tên nói lên tất cả, nó là một cái board chứa các story của app. Storyboard có nhiều scene, mỗi scene lại chứa view controller đại diện cho một màn hình và các liên kết giữa các màn hình đó. Nhìn vào một view controller, chúng ta có thể dễ dàng nắm được flow và các màn hình của app đó. Tuy nhiên, Interface Builder và Storyboard cũng không phải phương pháp hoàn hảo và tối ưu để lập trình UI trong iOS. Trong bài viết này, chúng ta sẽ tìm hiểu ưu, nhược điểm của chúng và rút ra kết luận khi nào sử dụng thì thích hợp.

Như đã nói ở trên, IB và Storyboard cho phép develop nhìn thấy giao diện của app một cách trực quan mà không cần code cũng như hoàn thiện và chạy app lên. Rất dễ đối với người mới học iOS. Giúp nhanh chóng xây dựng một prototype của app. Thật vậy, bạn chỉ cần Storyboard là có thể tạo ra một app đơn giản hoặc cả prototype của app mà không cần code. Chỉ cần kéo, thả, móc, nối, run app. Easy peasy. Cũng để làm một prototype mà dùng code thì sẽ lâu hơn rất nhiều đấy.

1. Khó kéo thả các view phức tạp.

Kéo thả UI thật dễ, vui và nhanh nhưng đôi khi cần kéo thả các view lồng nhau hoặc đè lên nhau thì thật khó và bất tiện. Ví dụ bạn có một view to đã làm xong, sau đó cần thêm một view nhỏ hơn nhiều nằm sau view to đó. Design cho view nhỏ và làm cho nó nằm dưới view to quả thật sẽ mất thời gian. Đôi khi còn kéo nhầm nó thành sub view của view to. Ngoài ra, khi sử dụng Macbook màn hình nhỏ 13 inch, 11 inch hoặc các laptop cài Hackintosh độ phân giải thấp thì việc kéo thả với touch pad vào IB rất ức chế phải không.

2. IBOutlet và IBAction gây crash app.

Khi kéo thả các IBOutlet và IBAction vào các ViewController, chỉ cần bạn xóa, đổi tên, refactor code mà trên IB không cập nhật lại thì app sẽ ngay lập tức crash và Xcode hiện thông báo lỗi không friendly chút nào. *** Terminating app due to uncaught exception 'NSUnknownKeyException', reason: '[<YourApp.NewViewController 0x7fc3fcc04b20> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key scrollView.' Đối với developer có kinh nghiệm thì dễ dàng nhận ra nguyên nhân ngay. Nhưng dối với nhiều iOS beginner thì điều này đúng là một cơn ác mộng.

3. Cell, Storyboard, Segue Identifer.

Khi bạn set identifier cho UITableViewCell, UICollectionViewCell hoặc Storyboard, Segue ID thì chỉ cần có người sửa các giá trị đó thì app của bạn cũng sẽ crash ngay lập tức.

4. Thời gian compile tăng.

Các storyboard có quá nhiều scene hoặc một app có quá nhiều storyboard và XIB cũng sẽ làm tăng thời gian compile, build app. File code rõ ràng compile sẽ nhanh hơn file XIB và Storyboard rồi.

5. Performance Xcode.

Khi bạn chuyển qua lại từ 1 file code Swift, Objective-C sang IB: Storyboard hoặc XIB để làm việc hoặc mở chế độ Asistant editor 2 cửa sổ cùng lúc, Xcode sẽ bị delay 3~5 giây. Thậm chí đối với các máy Mac đời cũ hoặc không dùng ổ SSD thì thời gian chờ sẽ rất lâu đấy.

6. Storyboard là một đống hỗn độn.

Đối với các storyboard đơn giản, ít scene thì còn đỡ chứ còn có nhiều scene, dây dợ nối nhau chằng chịt thì chính người làm ra storyboard đó còn khó khăn chứ đừng nói đến người khác nhìn vào. Giống như storyboard này đây.

7. Dễ bị merge conflict với người khác.

Khi làm việc trong một team, nếu dùng storyboard thì sẽ rất dễ gây ra conflict khi merge code. Và việc fix conflict trong storyboard gây tốn nhiều thời gian vì code XML Xcode tự generate nhìn không thích mắt một chút nào.

8. Không có tính tái sử dụng.

Giả sử bạn có 5 màn hình hoặc 5 cell gần gần giống nhau. Nếu dùng custom code thì rất dễ để xử lý vấn đề này với tính kế thừa trong OOP, giúp tái sử dụng code UI. Storyboard sẽ chẳng có cách nào để tái sử dụng giao diện đã kéo thả. Trừ khi bạn copy và paste rồi ngồi làm lại constraint, kéo lại các IBOutlet, IBAction cho từng màn hình giống nhau một. Quá thủ công phải không.

Trên đây là một số ưu và nhược điểm của Interface Builder và Storyboard. Có thể thấy rằng Storyboard thích hợp cho các app nhỏ, số lượng màn hình không nhiều, các màn hình design không quá phức tạp, flow app đơn giản. Ngược lại không nên dùng trong các dự án lớn, logic, bussiness phức tạp, tái sử dụng nhiều UI. Có lẽ giải pháp tốt nhất cho các dự án lớn là kết hợp cả Storyboard, XIB và custom code là giải pháp tốt nhất.