Ember Times-Issue 148


👋 Humanitarian! 🐹

Watch the new EmberMap video {{on}} Settings in modifiers 🔦, mut and Octane are automatically tracked📖, Ember Twiddle updates🌟, Ember performance adjustments🏎, use ember-cli-deploy and GitHub operations✅ Preview deployment, and last but not least, view from the JavaScript file The generated helper ✨!


View New EmberMap video in {{on}} Modifiers, a new way to attach events in Ember. It can be attached to ordinary HTML elements or Ember components.

<Toggle
  @checked={{this.isAdmin}}
  @onChange={{this.toggleIsAdmin}}
  {{on 'mouseenter' this.showTip}}
  {{on 'mouseleave' this.hideTip}}
/>

This {{on}} The modifier accepts two parameters: event name and function handler.This Event name Actually the same argument as vanilla JS API element.addEventListener(eventName) accept.and Function handler Any action means any correctly bound function. It can exist in the component instance, or it can be passed in as a parameter.

<span
  role='checkbox'
  aria-checked={{if this.isChecked 'true' 'false'}}
  {{on 'click' this.toggle}}
  {{on 'keydown' this.toggle}}
>
  {{! additional HTML }}
</span>

View full video explanation {{on}} modify Embers Map!


There is a new blog post from Chris Crichrycho (@chriskrycho) Regarding some behaviors that may surprise you when using automatic tracking mut or set helpers, and how they differ from the use of operations in Ember Octane.

Read more about this Chris’ blogThis is a quick read, if you realize the problem in advance, it may prevent you from doing some refactoring pain. 😃


Embers spin 0.17.1 Here, now supports Man 3.18 And template hosting! Need to share a copy of the Ember code? Ember Twiddle is Ember’s JSFiddle.

View updates: ember-twiddle.com And thank you Gaurav Munjal (@Gaurav0), @拉贾SK05 with Gokul Kathirvel (@gokatz) Thanks for their contribution to the release! 👏


Abhilash LR (@abhilashlr) About the blog Optimize the build schedule and package size In your Ember application, this is the first in a series of introductory performance optimization!Check out his tips and tricks in the article Here. Highlights include:

  • Accelerate development
    • Remove test from development version
    • Remove Mirage from the development version
    • Minification, gzip or brotli compression and fingerprint recognition
  • Asset size
    • Analyze bundle size and optimize asset size
    • Remove dependencies that are not needed when the application starts

The smaller the page resources, the faster users can view them. The faster users view pages with text and UI, the higher their trust in our application/website.

But wait, there is more!In Abilash The second part of the performance blog series It’s all about Optimize assets Get a perfect Lighthouse score. It teaches you how to reduce the number of requests for application assets to an absolute minimum, effectively optimize your images and many other modern best practices related to asset handling.

If you want your application to load at the speed of light, be sure to Look at today’s article!


Never seen an assistant generated from a JavaScript file before?Then you should take a look The latest RFC about invokeHelper Application program interface!

The proposal suggests creating a new API that allows you to call Auxiliary function Via JavaScript, not just via templates (this is the only way to invoke assistants in Ember applications today). This will extend Ember’s reactive model through the following APIs:

  • Allows transparent reuse of common code and patterns
  • Because, similar to a component, has a life cycle
  • Unlike components, JavaScript classes with The template is compatible.

If you want to learn more about API design invokeHelper, Please be sure to read Complete RFC And post your questions and ideas in Comments below!


If you haven’t had a chance, we encourage you to check Simon ihmig (@simonihmig)Today’s blog post.You can learn how to use ember-cli-deployment Plugins and GitHub operations Preview deployment from pull request!


This week we want to thank @pzuraq, @igorT, @allthesignals, @rwjblue, @chancancode, @卢克梅利亚, @SYU15, @mmun, @mrloop, @runspired with @stefanpenner Thanks for their contributions to Ember and related repositories! 💖


Tomster mascot during office hours

Want to know about Ember, Ember Data, Glimmer, or plugins in the Ember ecosystem, but don’t know where to consult? Readers’ questions are only answered for you!

Submit your own Short and sweet problem under bit.ly/ask-ember-coreDon’t worry, there are no stupid questions, we thank them-guaranteed! 🤞


Want to write for Ember Times? Any suggestions for next week’s problem?join us #support-ember-times in Ember community discord Or ping us @embertimes On Twitter.

Subscribe to our channel to get the latest news from Emberland this week Email newsletter!You can also find our posts in the following locations People Blog.


That is another package! ✨

Be kind,

Chris Ng, Amy Lam, Jessica Jordan, Isaac Lee, Jared Galanis and the learning team



Leave a Reply

Your email address will not be published. Required fields are marked *