1# Using TaskPool for Independent Time-Consuming Tasks
2
3For a time-consuming task that runs independently, you only need to return the result to the host thread after the task is executed. There is no context dependency. You can implement the task in the following way:
4
5The following uses image loading as an example.
6
71. Implement the task to be executed by the sub-thread.
8
9   ```ts
10   // IconItemSource.ets
11   export class IconItemSource {
12     image: string | Resource = '';
13     text: string | Resource = '';
14
15     constructor(image: string | Resource = '', text: string | Resource = '') {
16       this.image = image;
17       this.text = text;
18     }
19   }
20   ```
21
22   ```ts
23   // IndependentTask.ets
24   import { IconItemSource } from './IconItemSource';
25
26   @Concurrent // Methods executed in the task must be decorated by @Concurrent. Otherwise, they cannot be called.
27   @Concurrent
28   export function loadPicture(count: number): IconItemSource[] {
29     let iconItemSourceList: IconItemSource[] = [];
30     // Traverse and add six IconItem data records.
31     for (let index = 0; index < count; index++) {
32       const numStart: number = index * 6;
33       // Six images are used cyclically.
34       iconItemSourceList.push(new IconItemSource('$media:startIcon', `item${numStart + 1}`));
35       iconItemSourceList.push(new IconItemSource('$media:background', `item${numStart + 2}`));
36       iconItemSourceList.push(new IconItemSource('$media:foreground', `item${numStart + 3}`));
37       iconItemSourceList.push(new IconItemSource('$media:startIcon', `item${numStart + 4}`));
38       iconItemSourceList.push(new IconItemSource('$media:background', `item${numStart + 5}`));
39       iconItemSourceList.push(new IconItemSource('$media:foreground', `item${numStart + 6}`));
40     }
41     return iconItemSourceList;
42   }
43   ```
44
452. The execute method in TaskPool is used to execute the preceding task, that is, load images.
46
47   ```ts
48   // Index.ets
49   import { taskpool } from '@kit.ArkTS';
50   import { IconItemSource } from './IconItemSource';
51   import { loadPicture } from './IndependentTask';
52
53   @Entry
54   @Component
55   struct Index {
56     @State message: string = 'Hello World';
57
58     build() {
59       Row() {
60         Column() {
61           Text(this.message)
62             .fontSize(50)
63             .fontWeight(FontWeight.Bold)
64             .onClick(() => {
65               let iconItemSourceList: IconItemSource[] = [];
66               // Create a task.
67               let lodePictureTask: taskpool.Task = new taskpool.Task(loadPicture, 30);
68               // Execute the task and return the result.
69               taskpool.execute(lodePictureTask).then((res: object) => {
70                 // Execution result of the loadPicture API.
71                 iconItemSourceList = res as IconItemSource[];
72               })
73             })
74         }
75         .width('100%')
76       }
77       .height('100%')
78     }
79   }
80   ```
81