митасов роман
TRANSCRIPT
2
WebAgent
3
4
5
6
7
8
9
Синхронизация
10
11
12
13
14
15
16
17
18
19
20
21
22
23
Зачем?
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
Синхронизация интерфейса
41
Транспорт:
42
Транспорт:
1. Сервер
43
Транспорт:
1. Сервер
2. Flash
44
Транспорт:
1. Сервер
2. Flash
3. Клиентские хранилища
45
Возможные подходы:
46
Возможные подходы:
1. События
47
Возможные подходы:
1. События
2. Состояния
48
Возможные подходы:
1. События
2. Состояния
3. Смешанные
49
Возможные подходы:
1. События
2. Состояния
3. Смешанные
50
51
52
Сервер - WebAgent1.0 :
53
Сервер - WebAgent1.0 :• Синхронизация смешанная
54
Client
55
Client ClientClient Client Client
56
Server
Client ClientClient Client Client
57
Server
Client ClientClient Client Client
58
Server
Client ClientClient Client Client
59
Server
Client ClientClient Client Client
60
Server
Client ClientClient Client Client
61
Server
Client ClientClient Client Client
62
Server
Client ClientClient Client Client
63
Server
Client ClientClient Client Client
64
Сервер - WebAgent1.0 :• Синхронизация смешанная
65
Сервер - WebAgent1.0 :• Синхронизация смешанная
Минусы:
66
Сервер - WebAgent1.0 :• Синхронизация смешанная
Минусы:• Сетевые задержки
67
Server
Client ClientClient Client Client
68
Server
Client ClientClient Client Client
69
Server
Client ClientClient Client Client
70
Server
Client ClientClient Client Client
71
Server
Client ClientClient Client Client
72
Сервер - WebAgent1.0 :• Синхронизация смешанная
Минусы:• Сетевые задержки
73
Сервер - WebAgent1.0 :• Синхронизация смешанная
Минусы:• Сетевые задержки• Много соединений с
сервером
74
Flash – WebAgent 2.0 :
75
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router
76
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router• Есть хранилище, возможна
синхронизация состояний
77
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router• Есть хранилище, возможна
синхронизация состояний• Синхронизация событиями
78
LocalConnection
79
80
81
82
83
84
85
86
87
88
Router
89
Client ClientClient Client Client
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Router
92
Server
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Router
93
Server
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Router
94
Server
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Router
95
Server
Client ClientClient Client Client
Fl Fl Fl Fl Fl
Router
96
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router• Есть хранилище, возможна
синхронизация состояний• Синхронизация событиями
97
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router• Есть хранилище, возможна
синхронизация состояний• Синхронизация событиями
Минусы :
98
Flash – WebAgent 2.0 :• Диспетчер в клиенте – router• Есть хранилище, возможна
синхронизация состояний• Синхронизация событиями
Минусы :• Глюки флеша
99
Flash – WebAgent 2.0 :
“Подводные камни”:
100
Flash – WebAgent 2.0 :
“Подводные камни”:• Хрупкость системы
101
102
103
WebStorage – WebAgent 3.0 :
104
WebStorage – WebAgent 3.0 :• Синхронизация состояний
105
Синхронизация состояний
106
Router
Router
Router
Router
110
Router
111
Router
112
113
114
115
116
117
118
119
WebStorage – WebAgent 3.0 :• Синхронизация состояний
120
WebStorage – WebAgent 3.0 :• Синхронизация состояний• Задача выбора роутера
121
Выбор роутера
122
123
124
125
126
127
router
128
router
129
router
130
router
Write(window_id)
131
router
Write(window_id)
132
router
Write(window_id)
133
Write(window_id)
134
router
Write(window_id)
135
router
Write(window_id)
136
router
Write(window_id)
onbeforeunload
137
router
Write(window_id)
onbeforeunload
Write(false)
138
router
Write(window_id)
onbeforeunload
Write(false)
onstorage
139
140
141
Read(window_id)
142
Read(window_id)
143
Read(window_id)
144
145
146
147
148
149
WebStorage – WebAgent 3.0 :• Синхронизация состояний• Задача выбора роутера
150
WebStorage – WebAgent 3.0 :• Синхронизация состояний• Задача выбора роутера
“Подводные камни”:
151
WebStorage – WebAgent 3.0 :• Синхронизация состояний• Задача выбора роутера
“Подводные камни”:• Баги реализации в браузерах
152
Баги реализации в браузерах:
153
Баги реализации в браузерах:• onstorage
154
onStorage
155
localStorage.testvar = 0;
156
localStorage.testvar = 0;
for(var i = 0; i < 3; i++) {
}
157
localStorage.testvar = 0;
for(var i = 0; i < 3; i++) {
localStorage.testvar++;
}
158
localStorage.testvar = 0;
console.log(localStorage.testvar);
for(var i = 0; i < 3; i++) {
localStorage.testvar++;
console.log(localStorage.testvar);
}
159
window.addEventListener(‘storage’, function (e) {
}, true)
160
window.addEventListener(‘storage’, function (e) {
console.log(e.key)
}, true)
161
window.addEventListener(‘storage’, function (e) {
console.log(e.key, e.newValue )
}, true)
162
window.addEventListener(‘storage’, function (e) {
console.log(e.key, e.newValue, e.oldValue)
}, true)
163
window.addEventListener(‘storage’, function (e) {
console.log(e.key, e.newValue, e.oldValue, localStorage.testvar)
}, true)
164
165
for (…
166
for (… addEvent…
167
Chrome, Opera, FF6+
169
Chrome, Opera, FF6+Таб 1 – цикл
170
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
171
0
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
172
01
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
173
012
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
174
0123
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
175
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
176
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
177
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
178
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
179
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
180
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
181
0123
testvar 0 null 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
182
0123
testvar 0 null 3testvar 1 0 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
183
0123
testvar 0 null 3testvar 1 0 3testvar 2 1 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
184
0123
testvar 0 null 3testvar 1 0 3testvar 2 1 3testvar 3 2 3
Chrome, Opera, FF6+Таб 1 – цикл Таб 2 – addEventList…
185
Многозадачность
186
Многозадачность:• Chrome и IE – в каждом табе / окное
187
Многозадачность:• Chrome и IE – в каждом табе / окное• Opera – в каждом iframe
188
Многозадачность:• Chrome и IE – в каждом табе / окное• Opera – в каждом iframe• FF – один на все окна / табы
189
190
FF3.6Таб 1 – цикл Таб 2 – addEventList…
191
0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
192
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
193
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
194
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
195
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
196
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
197
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
198
0 undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
199
01
undef undef undef 0
FF3.6Таб 1 – цикл Таб 2 – addEventList…
200
01
undef undef undef 0undef undef undef 1
FF3.6Таб 1 – цикл Таб 2 – addEventList…
201
012
undef undef undef 0undef undef undef 1
FF3.6Таб 1 – цикл Таб 2 – addEventList…
202
012
undef undef undef 0undef undef undef 1undef undef undef 2
FF3.6Таб 1 – цикл Таб 2 – addEventList…
203
0123
undef undef undef 0undef undef undef 1undef undef undef 2
FF3.6Таб 1 – цикл Таб 2 – addEventList…
204
0123
undef undef undef 0undef undef undef 1undef undef undef 2undef undef undef 3
FF3.6Таб 1 – цикл Таб 2 – addEventList…
205
206
IE8Таб 1 – цикл Таб 2 – addEventList…
207
0
IE8Таб 1 – цикл Таб 2 – addEventList…
208
01
IE8Таб 1 – цикл Таб 2 – addEventList…
209
012
IE8Таб 1 – цикл Таб 2 – addEventList…
210
0123
IE8Таб 1 – цикл Таб 2 – addEventList…
211
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
212
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
213
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
214
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
215
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
216
0123
undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
217
0123
undef undef undef 3undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
218
0123
undef undef undef 3undef undef undef 3undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
219
0123
undef undef undef 3undef undef undef 3undef undef undef 3undef undef undef 3
IE8Таб 1 – цикл Таб 2 – addEventList…
220
Баги реализации в браузерах:• Onstorage
221
Баги реализации в браузерах:• Onstorage• IE8+
222
Нюансы IE8+:
223
Нюансы IE8+:• Асинхронные тормоза на записи
224
Нюансы IE8+:• Асинхронные тормоза на записи• Отложенный момент записи на диск
225
Нюансы IE8+:• Асинхронные тормоза на записи• Отложенный момент записи на диск• Данные могут разъехаться
226
Нюансы IE8+:• Асинхронные тормоза на записи• Отложенный момент записи на диск• Данные могут разъехаться• 64 IE на 64 Win
227
