The document discusses the increasing complexity of web development over time and introduces Volt as a Ruby-based isomorphic framework that allows sharing code between the client and server. Volt uses Opal to compile Ruby code to JavaScript and supports features like automatic data syncing, reactive bindings, and building apps as nested components to help manage complexity. It aims to provide a simpler development experience compared to traditional approaches while still offering high performance.
39. COMPLEXITY
JS Bridge
Performance
File Size
Debugging
Complexity
Base Language
this
Type Coersion
No Std Lib
WTFâs
Falseness
Base Language
JavaScript Compiled Ruby
40. COMPLEXITY
Debugging
Base Language
this
Type Coersion
No Std Lib
WTFâs
Falseness
Base Language
JavaScript Compiled Ruby
44. WTFâs
this parseInt new type coercion
semicolon insertion typeof == vs ===
case fall-through broken comparators
âstringâ instanceof String == false
undefined
45. PERCEPTION
âExperimenting with @opalrb - every time I
expected to find an issue, nothing happened.
Maybe it'll be time to retire coffeescript soonâŠâ
- Sidu Ponnappa
48. DEBUGGING IN OPAL
Transpiling
Source Maps
Framework Black Boxing
RubySpecs
Opal-IRB
49. TRANSPILING
local variables => local variables
instance variables => object properties
methods => function on object
with $ prefix
classes => prototypes
50. TRANSPILING
class User
def initialize(name, age)
@name = name
@byear = Time.now.year - age
end
def welcome
âHi #{@name}, you were born in #{@byear}"
end
end
puts User.new('Ryan', 29).welcome
51. def.name = def.birth_year = nil;
def.$initialize = function(name, age) {
var self = this;
self.name = name;
return self.byear = $scope.get('Time').$now().$year()['$-'](age);
};
return (def.$welcome_message = function() {
var self = this;
return "Hi " + (self.name) + ", you were born in " + (self.byear);
}, nil) && 'welcome_message';
52. def.name = def.birth_year = nil;
def.$initialize = function(name, age) {
var self = this;
self.name = name;
return self.byear = $scope.get('Time').$now().$year()['$-'](age);
};
return (def.$welcome_message = function() {
var self = this;
return "Hi " + (self.name) + ", you were born in " + (self.byear);
}, nil) && 'welcome_message';
53. def.name = def.birth_year = nil;
def.$initialize = function(name, age) {
var self = this;
self.name = name;
return self.byear = $scope.get('Time').$now().$year()['$-'](age);
};
return (def.$welcome_message = function() {
var self = this;
return "Hi " + (self.name) + ", you were born in " + (self.byear);
}, nil) && 'welcome_message';
54. def.name = def.birth_year = nil;
def.$initialize = function(name, age) {
var self = this;
self.name = name;
return self.byear = $scope.get('Time').$now().$year()['$-'](age);
};
return (def.$welcome_message = function() {
var self = this;
return "Hi " + (self.name) + ", you were born in " + (self.byear);
}, nil) && 'welcome_message';
62. COMPLEXITY
JS Bridge
Performance
File Size
Debugging
Complexity
Base Language
this
Type Coersion
No Std Lib
WTFâs
Falseness
Base Language
JavaScript Compiled Ruby
63. COMPLEXITY
Debugging
Base Language
this
Type Coersion
No Std Lib
WTFâs
Falseness
Base Language
JavaScript Compiled Ruby