This change adjust the equality comparator used by NgSwitch - now it
defaults to === from previously used ==. This change is based on the
following reasoning:
- align behaviour with the built-in switch block);
- improve performance (avoid type coercion);
- enable better type-checking.
BREAKING CHANGE:
the NgSwitch directive now defaults to the === equality operator,
migrating from the previously used ==. NgSwitch expressions and / or
individual condition values need adjusting to this stricter equality
check. The added warning message should help pinpointing NgSwitch
usages where adjustements are needed.
Fixes#33873
PR Close#51504
Add a new loaderParams attribute, which can be used to send arbitrary data to a custom loader, allowing for greater control of image CDN features.
PR Close#48907
Warn the user in the console in case the `ngSrcset` is present and no
loader is configured. In this case, the default loader is used and
it ignores this attribute.
PR Close#48804
This commit adds a missing warning if the image directive
detects that you're hosting your image on one of our
supported image CDNs but you're not using the built-in loader
for it. This excludes applications that are using a custom
loader.
PR Close#47330
This commit adds a logic that generates preload tags for priority images, when rendering happens on the server (e.g. Angular Universal).
PR Close#47343
Previously the built-in image loaders for the optimized image directive
were tightly coupled to the preconnect checks infrastructure. This was
creating a problem when developers were trying to provide a loader on
a component level (or, more generally, deeper in the DI hierarchy):
- PreconnectLinkChecker is the application-level service, provided in root;
- it makes sense to provide loaders in different parts of the DI hierarchy;
This refactoring removes the PreconnectLinkChecker configuration from
the loaders infrastructure and makes it application-wide config. The
PRECONNECT_CHECK_BLOCKLIST is also a simple provider (it was a
multi-provider previously) which should make the overall configuration
easier.
PR Close#47565
This commit adds a console warning in development mode
if the ultimate rendered size of the image is much
smaller than the dimensions of the requested image.
In this case, the warning recommends adjusting the
size of the source image or using the `rawSrcset`
attribute to implement responsive sizing.
PR Close#47082
This commit updates the logic of Image Loaders to throw an error in case an absolute URL is provided an an input to the loader function. The loaders can construct URLs based on image paths relative to the bas URL configured for a loader.
PR Close#47082
This commit adds an extra logic to add an ability to exclude origins from preconnect checks in NgOptimizedImage by configuring the `PRECONNECT_CHECK_BLOCKLIST` multi-provider.
PR Close#47082
This commit updates the `NgOptimizedImage` directive to add a logic to detect whether an image, marked with the "priority" attribute has a corresponding `<link rel="preconnect">` tag in the `document.head` for better performance.
PR Close#47082
This commit adds a `rawSrcset` attribute as a replacement for the
`srcset` attribute. The `srcset` attribute cannot be set statically
on the image directive because it would cause images to start
downloading before the "loading" attribute could be set to "lazy".
Changing the name to `rawSrcset` allows the directive to control
the timing of image loading. It also makes it possible to support
custom loaders for `srcset` file names. Rather than having to repeat
the image origin for each image, the existing `rawSrc` value and
image loader can be composed to generate each full URL string. The
developer must only provide the necessary widths for the `srcset`.
For example, the developer might write:
```markup
<img rawSrc="hermes.jpg" rawSrcset="100w, 200w" ... />
```
with a loader like:
```js
const loader = (config) => `path/${config.src}?w=${config.width}`;
```
and the img tag will ultimately be set up as something like:
```markup
<img src="path/hermes.jpg?w=100" srcset="path/hermes.jpg?w=100 100w, path/hermes.jpg?w=200 200w" .../>
```
PR Close#47082
This commit adds e2e tests for the LCP check logic. Those tests are needed to verify the behavior in a real browser (vs relying on a Node environment).
PR Close#47082
This commit updates the `NgOptimizeImage` directive to add asserts to make sure the `width` and `height` inputs are set and have correct values (numbers only).
PR Close#47082
Runtime error codes in the Core, Common and Forms packages were not included into the `public-api` group reviews. This commit creates the necessary golden files to keep track of further changes in the runtime codes.
This is a followup from https://github.com/angular/angular/pull/44398#issuecomment-1006910976.
PR Close#44677