Ext JS 7.0 Has Arrived

 Ext JS version 7.0 is finally over! The latest milestone update for our highly regarded JavaScript framework is now generally available, bringing major enhancements to the Modern Toolkit.

Modern Toolkit Enhancements in the Ext JS 7.0 release include:

• ​Froala WYSIWYG HTML Edito​r- Froala, a light-weight WYSIWYG HTML Editor written in JavaScript, is now a part of Ext JS framework. Edit your application code using the smartest, feature-rich editing capabilities
• Tree Drag and Drop- Easily move and reorder tree menus 
• CheckBoxGroup Form Component- Group collection of checkbox buttons in a flexible format
• RadioGroup Form Component- Customize option selection with radio buttons
• Breadcrumb Toolbar- Present information in an easily navigable hierarchical format 
• Accordion Panel- Support multiple expandable/collapsible panels
• Accessibility improvements: Keyboard/Focus Management, Tab Indexing
• Quality improvements throughout the Modern and Classic toolkits addressing over 70 customer reported issues.
• And more!

React v16.9.0 and the Roadmap Update

Renaming Unsafe Lifecycle Methods 

Over a year ago, we announced that unsafe lifecycle methods are getting renamed:

• componentWillMount → UNSAFE_componentWillMount
• componentWillReceiveProps → UNSAFE_componentWillReceiveProps
• componentWillUpdate → UNSAFE_componentWillUpdate

Deprecating javascript: URLs

URLs starting with javascript: are a dangerous attack surface because it’s easy to accidentally include unsanitized output in a tag like <a href> and create a security hole

Deprecating “Factory” Components 

Before compiling JavaScript classes with Babel became popular, React had support for a “factory” component that returns an object with a render method:

New Features 

Async act() for Testing

Performance Measurements with <React.Profiler>

Reference: Reactjs Blog

Understanding the Spread Operator in JavaScript

Today we are going to discuss about the ES6 feature of Spread operator, Based on MDN docs.

Spread syntax allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.

Syntax for how to use:

For function calls:

myFunction(...iterableObj);

For array literals or strings:

[...iterableObj, '4', 'five', 6];

For object literals (new in ECMAScript 2018):

let objClone = { ...obj };

Example of Replace of apply:

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers));
// expected output: 6

console.log(sum.apply(null, numbers));
// expected output: 6

concatenate arrays

var arr1 = [0, 1, 2];

var arr2 = [3, 4, 5];

arr1 = [...arr1, ...arr2]; // arr1 is now [0, 1, 2, 3, 4, 5]

Spread in object literals

var obj1 = { foo: 'bar', x: 42 };

var obj2 = { foo: 'baz', y: 13 };

var clonedObj = { ...obj1 };

// Object { foo: "bar", x: 42 }

var mergedObj = { ...obj1, ...obj2 };

// Object { foo: "baz", x: 42, y: 13 }