Skip to content

5.0.0

Compare
Choose a tag to compare
@matthewp matthewp released this 06 Jul 13:56
· 1409 commits to master since this release

Big changes

This release includes:

  • can-query-logic, a simplified replacement for can-set.
  • New service layer packages, moving can-connect to an infrastructure project
  • Support for tree-shaking.
  • Builds of core and ecosystem modules that can be used directly in the browser.
  • Routing broken into separate modules, paving the way for future improvements.

can-query-logic

The can-query-logic package exports a constructor function that builds query logic
from:

  • an optional schema or type argument, and
  • an optional options argument used to convert alternate parameters to
    the expected query format.

For example, the following builds query logic from a DefineMap:

import { DefineMap, QueryLogic } from "can";

const Todo = DefineMap.extend({
    id: {
        identity: true,
        type: "number"
    },
    name: "string",
    complete: "boolean"
});

var todoQueryLogic = new QueryLogic(Todo);

New service layer packages

can-connect is the backbone for integrating with your service layer. But most never take advantage of the flexibility using can-connect directly provides.

To make things easier, the following new packages were created which bundles together various connect behaviors:

  • can-realtime-rest-model. This allows you to build models that are connected to your service layer and can receive realtime updates (using Socket.io, WebSockets, or any other real-time library).
  • can-rest-model. Contains the most basic features needed for connecting a map to your service layer. It is like can-realtime-rest-model but without the realtime.
  • can-super-model. The kitchen sink. This model layer contains real-time, fall through caching, and everything else that can-connect contains.

Tree-shaking

Using a bundler / module loader capable of tree-shaking, such as steal 2.0, webpack, or rollup you can import items from the can package directly, and anything not used will be removed from your production build.

import { DefineMap, fixture } from "can";

DefineMap.extend("ViewModel", { ... });

In the above example, can-define, can-fixture, and any packages they rely upon will be included in the build. Other unrelated packages, such as can-observe, will not.

Web compatible ES module builds

The can package now contains 2 modules that can be consumed directly from the browser. They can be used like:

<script type="module">
import { Component } from "//unpkg.com/can@5/core.mjs";

Component.extend({
    tag: "my-app",
    view: `CanJS {{feels}} modules`,
    ViewModel: {
        feels: { default: "😍" }
    }
});
</script>

Both core and ecosystem packages include these ES module builds (available via can/core.mjs and can/ecosystem.mjs respectively). Minified versions are available as well.

This is useful for building demos, demonstrating bugs, or even for small apps. See the Setting Up CanJS guide for more information on using these packages.

route.urlData and can-route-pushstate 5.0

Due to adding support for tree-shaking, we needed a way to make can-route-pushstate not have side-effects, otherwise simply importing can would result in pushstate routing being enabled.

We added a new .urlData property that can be set in can-route, that works similarly to the .data property for connecting a view model. To enable pushstate do this:

import { route, RoutePushstate } from "can";

route.urlData = new RoutePushstate();
route.register("{page}", { page: "home" });
route.start();

Updates to individual packages

can-ajax

can-assign

can-attribute-encoder

See canjs/can-attribute-encoder#21

can-attribute-observable

can-bind

can-child-nodes

can-cid

can-component

can-compute

  • Unbinding temporary computes now uses (polyfilled) setImmediate instead of a 10ms timeout. This is to make dependent events happen in queue more consistently with mutation observer events (which also use setImmediate in vdom, and native immediate timeouts with real DOM).
  • COMPUTE.truthy now doesn't automatically evaluate functions if computes return them as values. This supports using "@" expressions (which do not evaluate a reference function to its returned value) with {{#if}} in can-stache.
  • Some external dev dependencies updated: testee and generator-donejs

can-connect

This change migrates can-connect to being an infrastructure package. can-rest-model, can-rest-realtime-model, can-super-model and others will serve as the primary way in which users will use can-connect.

can-connect-feathers

can-connect-tag

can-construct

can-construct-super

can-control

can-data-types

can-debug

canjs/can-debug#45

can-define

import {DefineMap, Reflect} from "can";

const Todo = DefineMap.extend("Todo",{
    id: {type: "number", identity: true},
    name: "string",
    complete: "boolean"
});

var todo = new Todo({id: 6, name: "mow lawn"});

Reflect.getIdentity(todo) //-> 6

can-define-backup

can-define-lazy-value

can-define-stream

can-define-stream-kefir

can-define-validate-validatejs

can-deparam

canjs/can-deparam@v1.0.1...v1.0.2

can-diff

can-dom-events

can-dom-mutate

can-event-dom-enter

can-event-dom-radiochange

can-event-queue

can-fixture

can-fixture-socket

canjs/can-fixture-socket@v0.7.1...v0.7.2

can-fragment

can-globals

can-kefir

can-key

can-key-tree

can-list

can-local-store

can-map

var map = new Map({ 0: "zero" });
canReflect.getKeyValue(map, 0);

and

var map = new Map({ 0: "zero" });
map.attr({ 1: "one" }, "true");

canjs/can-map#97

can-map-define

can-memory-store

can-ndjson-stream

can-observation

can-observation-recorder

can-observe

can-param

can-parse-uri

can-query-logic

can-queues

can-realtime-rest-model

can-reflect

can-reflect-dependencies

can-reflect-promise

can-rest-model

can-route

can-route-hash

can-route-mock

can-route-pushstate

import route from "can-route";
import RoutePushstate from "can-route-pushstate";

route.urlData = new RoutePushstate();
route.register("{page}");

can-set-legacy

can-simple-dom

can-simple-map

can-simple-observable

can-stache

can-stache-bindings

can-stache-converters

can-stache-key

canjs/can-stache-key#32

can-stache-route-helpers

can-stream

can-stream-kefir

can-string

can-string-to-any

can-super-model

can-validate

can-validate-interface

can-validate-legacy

can-validate-validatejs

can-value

can-vdom

can-view-autorender

can-view-callbacks

can-view-live

for faster performance

can-view-nodelist

canjs/can-view-nodelist@ee27a53

can-view-parser

can-view-scope

var VM = DefineMap.extend({
  foo: "string"
});
var vm = new VM();
var scope = new Scope(vm);
scope.read("foo").parentHasKey; // -> true

This also makes it so that getPathsForKey will return back paths where the key returns a function.

canjs/can-view-scope#172.

can-view-target