Skip to content

Commit 7a8184f

Browse files
committed
docs: Changeset and README
1 parent f291e6c commit 7a8184f

File tree

2 files changed

+18
-42
lines changed

2 files changed

+18
-42
lines changed

.changeset/wild-lizards-raise.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
'preact-cli': major
3+
---
4+
5+
Removes support for automatic async routes via `@preact/async-loader`.
6+
7+
Instead of magic directories, users can use `preact-iso`'s `lazy()` to split routes & components as they wish from anywhere.
8+
9+
This should be a lot more powerful and transparent compared to the previous setup.
10+
11+
```js
12+
// before
13+
import Home from './routes/home';
14+
15+
// after
16+
import { lazy } from 'preact-iso';
17+
const Home = lazy(() => import('./routes/home.js'));
18+
```

README.md

Lines changed: 0 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,6 @@
3030
### Features
3131

3232
- **100/100 Lighthouse score**, right out of the box ([proof])
33-
- Fully **automatic code splitting** for routes _(see [Route-Based Code Splitting](#route-based-code-splitting))_
34-
- Transparently code-split any component with an [`async!`] prefix
3533
- Auto-generated [Service Workers] for offline caching powered by [Workbox]
3634
- [PRPL] pattern support for efficient loading
3735
- Zero-configuration pre-rendering / server-side rendering hydration
@@ -355,45 +353,6 @@ export default (config, env, helpers, options) => {
355353
};
356354
```
357355

358-
### Route-Based Code Splitting
359-
360-
"Route" components are automatically code-splitted at build time to create smaller bundles and avoid loading more code than is needed by each page. This works by intercepting imports for route components with an [async loader](https://github.com/preactjs/preact-cli/tree/master/packages/async-loader), which returns a lightweight wrapper component that handles code splitting seamlessly.
361-
362-
Automatic code splitting is applied to all JavaScript and TypeScript files in the following locations:
363-
364-
<table>
365-
<thead><tr><th>Pattern</th><th>Examples</th></tr></thead>
366-
<tbody>
367-
<tr><td>
368-
<pre>src/<b>routes</b>/<kbd>NAME</kbd></pre>
369-
</td><td>
370-
<code>src/routes/home.js</code><br>
371-
<code>src/routes/about/index.tsx</code>
372-
</td></tr>
373-
<tr><td>
374-
<pre>src/components/<b>routes</b>/<kbd>NAME</kbd></pre>
375-
</td><td>
376-
<code>src/components/routes/profile.ts</code><br>
377-
<code>src/components/routes/profile/index.js</code>
378-
</td></tr>
379-
<tr><td>
380-
<pre>src/components/<b>async</b>/<kbd>NAME</kbd></pre>
381-
</td><td>
382-
<code>src/components/async/profile.ts</code><br>
383-
<code>src/components/async/profile/index.js</code>
384-
</td></tr>
385-
</tbody></table>
386-
387-
> **Note**:
388-
> Automatic code splitting **only** supports default exports, not named exports:
389-
>
390-
> ```diff
391-
> - import { Profile } from './routes/profile';
392-
> + import Profile from './routes/profile';
393-
> ```
394-
>
395-
> This is an intentional limitation that ensures effective code splitting. For components that need named exports, place them in a directory that doesn't trigger automatic code splitting. You can then manually code-split the default export by re-exporting it from `routes/` or importing it with the `"async!"` prefix.
396-
397356
[promise]: https://npm.im/promise-polyfill
398357
[fetch]: https://github.com/developit/unfetch
399358
[preact]: https://github.com/preactjs/preact
@@ -420,7 +379,6 @@ Automatic code splitting is applied to all JavaScript and TypeScript files in th
420379
[preact cli preset]: https://github.com/preactjs/preact-cli/blob/master/packages/cli/src/lib/babel-config.js
421380
[service workers]: https://developers.google.com/web/fundamentals/getting-started/primers/service-workers
422381
[customize babel]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#customising-babel-options-using-loader-helpers
423-
[`async!`]: https://github.com/preactjs/preact-cli/blob/1.4.1/examples/full/src/components/app.js#L7
424382
[sass]: https://sass-lang.com
425383
[less]: http://lesscss.org
426384
[defineplugin]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#use-environment-variables-in-your-application

0 commit comments

Comments
 (0)