# Inline Components > * 如有錯誤處指正或任何建議，懇請留言，感謝! > * 搭配 ChatGPT 進行翻譯，請小心服用 > * ▸ ... 為英文原文 :::spoiler ... One of Qwik's super powers lies in its lazy-loading features. Qwik lazy-loads: - **Independent of hierarchy**: Components can be loaded out of order. For example, the code for a child component can load before its parent code. - **Based on interaction**: Code loading is deferred until a user interacts with a component. - **More than just components**: Qwik lazy-loads any closure including components, event listeners, effects, and behaviors. `$` marks a closure as lazy-loadable. For example [`component$()`](https://qwik.builder.io/docs/components/overview/#component) method makes the component lazy-loadable. When you see a `$` in Qwik code, you're crossing a lazy-loading boundary and have to be aware of special rules: - any lexically scoped variables must be declared as `const` - a captured variable/symbol must be either: - serializable - importable (Either from a different file as `import` or from this file using `export`) If you want to ensure a component loads with another component, you create an inline component. Inline components load as a part of the parent component and are equivalent to how most other frameworks deal with components. In this example, the `<App>` and a `<Greeter>` components are prepared for you. The `<Greeter />` component is declared using the [`component$()`](https://qwik.builder.io/docs/components/overview/#component) method and is a Qwik component. Remove the [`component$()`](https://qwik.builder.io/docs/components/overview/#component) to convert `<Greeter>` to an inline component. Open the `Symbols` tab and notice that the `<Greeter />` component is no longer an independent export, but instead is bundled as part of the `<App>` component. ::: ###### tags: `Components`