Using the :is(), :where(), and :has() Pseudo Elements in CSS
#css
β Link: https://medium.com/@austinrutledge0/a-guide-to-using-the-is-where-and-has-pseudo-elements-in-css-96916b65be27
#css
β Link: https://medium.com/@austinrutledge0/a-guide-to-using-the-is-where-and-has-pseudo-elements-in-css-96916b65be27
Π‘ollection of HTML tips
#html
1. Capture attribute to open your device camera
2. Automatic website refresh
3. Activate spellcheck
4. Specify file type to be uploaded
5. Automatically download on link click
#html
1. Capture attribute to open your device camera
<input type="file" capture="user" accept="image/*">
2. Automatic website refresh
<head>
<meta http-equiv="refresh" content="10">
</head>
3. Activate spellcheck
<input type="text" spellcheck="true" lang="en">
4. Specify file type to be uploaded
<input type="file" accept=".jpeg,.png">
5. Automatically download on link click
<a href="image.png" download>
Confirmation Dialog Decorator
#angular #decorator
β Link: https://itnext.io/confirm-dialog-with-decorator-in-angular-7491d1237667
#angular #decorator
β Link: https://itnext.io/confirm-dialog-with-decorator-in-angular-7491d1237667
π₯1
Implement Code Splitting for Smaller Bundles
#angular #webpack
Install dependencies
β Link: https://guillaume-ferber.medium.com/maximizing-performance-with-angular-tips-and-tricks-for-efficient-code-76939fe7333b
#angular #webpack
Install dependencies
npm install --save-dev webpack webpack-cli webpack-dev-server html-webpack-plugin clean-webpack-plugin
β Link: https://guillaume-ferber.medium.com/maximizing-performance-with-angular-tips-and-tricks-for-efficient-code-76939fe7333b
Use Tree Shaking to Remove Unused Code
#angular #webpack
β Link: https://guillaume-ferber.medium.com/maximizing-performance-with-angular-tips-and-tricks-for-efficient-code-76939fe7333b
#angular #webpack
β Link: https://guillaume-ferber.medium.com/maximizing-performance-with-angular-tips-and-tricks-for-efficient-code-76939fe7333b
β οΈ DestroyRef Provider in Angular
#angular #inject #destroyRef
π© > Angular 16
β Link: https://netbasal.com/getting-to-know-the-destroyref-provider-in-angular-9791aa096d77
#angular #inject #destroyRef
π© > Angular 16
β Link: https://netbasal.com/getting-to-know-the-destroyref-provider-in-angular-9791aa096d77
Angular initialization listeners
#angular
β Link: https://dev.to/ayyash/the-mystic-three-tokens-of-angular-appbootstraplistener-appinitializer-platforminitializer-76j
#angular
β Link: https://dev.to/ayyash/the-mystic-three-tokens-of-angular-appbootstraplistener-appinitializer-platforminitializer-76j
This media is not supported in your browser
VIEW IN TELEGRAM
CSS transition-timing-function
#css #animation
β Link: https://ishratumar.medium.com/css-transitions-and-sub-properties-explained-33745cc571b5
#css #animation
β Link: https://ishratumar.medium.com/css-transitions-and-sub-properties-explained-33745cc571b5
Custom RxJS Operators
#rxjs #custom
β Link: https://medium.com/@henriquecustodia/creating-custom-rxjs-operators-e7069d12164f
#rxjs #custom
β Link: https://medium.com/@henriquecustodia/creating-custom-rxjs-operators-e7069d12164f
JS Performance: Secrets to Reducing DOM Operations π
β³οΈ When we change the DOM, the browser must redraw the page, which can be slow and time-consuming. By reducing the number of DOM operations, we can keep page redrawing to a minimum, improving code performance.
#js
β Link: https://medium.com/front-end-weekly/boost-your-javascript-performance-secrets-to-reducing-dom-operations-4160162bd952
β³οΈ When we change the DOM, the browser must redraw the page, which can be slow and time-consuming. By reducing the number of DOM operations, we can keep page redrawing to a minimum, improving code performance.
#js
β Link: https://medium.com/front-end-weekly/boost-your-javascript-performance-secrets-to-reducing-dom-operations-4160162bd952
Angular theming using Dynamically Load CSS
#angular #theme
β οΈ To see the effect, compile the app with ng build.
β Link: https://medium.com/@piyalidas.it/angular-theme-integration-using-dynamically-load-css-1617147799bf
#angular #theme
β οΈ To see the effect, compile the app with ng build.
βstartβ: βnpm run build && ng serveβ
β Link: https://medium.com/@piyalidas.it/angular-theme-integration-using-dynamically-load-css-1617147799bf
β οΈ
#angular #guard #createUrlTreeFromSnapshot
π© > Angular 15
β Link: https://blog.herodevs.com/functional-router-guards-in-angular-15-open-the-door-to-happier-code-4a53bb60f78a
createUrlTreeFromSnapshot using in Angular#angular #guard #createUrlTreeFromSnapshot
π© > Angular 15
β Link: https://blog.herodevs.com/functional-router-guards-in-angular-15-open-the-door-to-happier-code-4a53bb60f78a