<Flutter> Flutter에서 async와 await 이해하

 

Flutter와 같은 UI 프레임워크에서 비동기 프로그래밍은 중요한 개념이다.

 

비동기 프로그래밍을 사용하면 긴 작업을 별도의 스레드에서 실행하여 애플리케이션의 성능과 사용자 경험을 향상시킬 수 있다.

 

Dart 언어에서는 비동기 처리를 위해 async와 await 키워드를 사용한다.

 

이 글에서는 Flutter에서 async와 await를 사용하는 방법을 알아본다.

비동기 프로그래밍이란 무엇인가?

비동기 프로그래밍은 작업이 동시에 진행되도록 도와주어 병목 현상을 방지하고 애플리케이션의 전반적인 성능을 개선한다.

예를 들어, 데이터를 서버에서 다운로드하는 동안 사용자가 애플리케이션의 다른 부분을 사용할 수 있도록 하여 애플리케이션을 빠르게 유지한다.

Flutter에서 async와 await 사용하기

Flutter에서 async와 await 키워드를 사용하면 비동기 함수를 쉽게 작성할 수 있다.

async 키워드: 비동기 작업을 수행하는 함수에서 사용되며, Future 객체를 반환한다.

Future<void> printDelayed() async {
  print('Hello before delay!');

  // 일부러 대기 시간을 주어 실제 인터넷 요청과 같은 비동기 작업을 시뮬레이션한다.
  await Future.delayed(Duration(seconds: 3));
  
  print('Hello after delay!');
}

await 키워드: 비동기 작업의 완료를 기다리기 위해 사용되며, async 함수 내에서만 사용 가능하다. await 키워드가 있는 구문이 실행되면, 해당 비동기 작업이 완료되기 전까지 다음 줄의 코드로 이동되지 않는다.

void main() async {
  await printDelayed();
  print('All done!');
}

예제: 앱에서 외부 API 데이터 가져오기

Flutter에서 외부 API를 호출하여 데이터를 가져올 때 비동기 처리를 사용한다. 다음 예제에서는 JSON 데이터를 가져오는 간단한 작업을 수행하는 예를 든다.

의존성 추가: http 패키지를 사용하여 HTTP 요청을 처리한다. pubspec.yaml 파일에 다음을 추가한다.

dependencies:
  http: ^0.13.3

import 'dart:convert';
import 'package:http/http.dart' as http;

Future<void> fetchData() async {
  final response = await http.get('https://jsonplaceholder.typicode.com/users/1');

  if (response.statusCode == 200) {
    Map<String, dynamic> data = jsonDecode(response.body);
    print('Data: $data');
  } else {
    print('Error: ${response.statusCode}');
  }
}

void main() async {
  await fetchData();
  print('All done!');
}

이 예제에서는 외부 API에서 데이터를 가져올 때 async와 await를 사용하여 비동기 처리를 수행하고, 결과를 출력한다.

정리

async와 await를 사용하여 비동기 함수를 작성하고 호출하는 것은 Flutter에서 중요한 개념이다.

이를 통해 원할한 사용자 경험이 가능해지며, 애플리케이션의 성능에 긍정적인 영향을 준다.

 

이 글을 통해 기본적인 비동기 프로그래밍 방법인 async와 await를 사용하는 방법을 정리해봤다.